/*----------------------------------------------
	view
---------------------------------------------*/
.view_pc { display: inherit !important; }
.view_sp { display: none !important; }

@media screen and (max-width: 640px){
	.view_pc { display: none !important; }
	.view_sp { display: inherit !important; }
	.font_mini_top1 {
	    font-size: 12px;
	    text-align: right;
	    margin-right: 0%;
	    margin-top: 50px;
	    color: #999;
	    display: none !important;
	}

	.font_mini_top2 {
	    font-size: 12px;
	    text-align: right;
	    margin-right: 1%;
	    color: #999;
	    margin-bottom: 50px;
	    display: inherit !important;
	}

}

html{
	font-family: 游ゴシック Medium;
}

.font_mini{
	font-size:12px;
	text-align:right;
	color:#999;
	margin-bottom:50px;
}

.font_mini_top1 {
    font-size: 12px;
    text-align: right;
    margin-right: 0%;
    margin-top: 50px;
    color: #999;
    display: inherit;
}

.font_mini_top2 {
    font-size: 12px;
    text-align: right;
    margin-right: 1%;
    color: #999;
    margin-bottom: 50px;
    display: none;
}

/*----------------------------------------------
	margin
---------------------------------------------*/
.mab10 { margin-bottom: 10px!important ; }
.mab20 { margin-bottom: 20px!important ; }
.mab30 { margin-bottom: 30px!important ; }
.mab40 { margin-bottom: 40px!important ; }
.mab50 { margin-bottom: 50px!important ; }

.pab10 { padding-bottom: 10px!important ; }
.pab20 { padding-bottom: 20px!important ; }
.pab30 { padding-bottom: 30px!important ; }
.pab40 { padding-bottom: 40px!important ; }
.pab50 { padding-bottom: 50px!important ; }


@media screen and (max-width: 640px){
	.mab10 { margin-bottom: 5px!important ; }
	.mab20 { margin-bottom: 10px!important ; }
	.mab30 { margin-bottom: 15px!important ; }
	.mab40 { margin-bottom: 20px!important ; }
	.mab50 { margin-bottom: 25px!important ; }
}

/*----------------------------------------------
	link
---------------------------------------------*/
a,
a:link {
	text-decoration: none;
	color: #0085B2;
	-webkit-transition: color .2s linear;
    -moz-transition: color .2s linear;
    -o-transition: color .2s linear;
	cursor: pointer;
}
a:hover {
	text-decoration: none;
	color: #F97305;
}

/*----------------------------------------------
	table
---------------------------------------------*/
table {
	width: 100%;
}
table.normal th, table.normal td {
	vertical-align: middle;
}
.table-a th, .table-a td {
	font-weight: normal;
	text-align: center;
	border: 1px solid #CCC;
	vertical-align: middle;
	padding: 5px;
}
.table-a th {
	background: #999;
	color: #FFF;
}
@media screen and (max-width: 640px) {
	table.normal th,  table.normal td {
		display: block;
	}
}

/*----------------------------------------------
	color parts
---------------------------------------------*/
.gray01{ background: #f2f2f2; }

.ora{ color: #FF4000;}

/*----------------------------------------------
	text
---------------------------------------------*/
.ALcenter { text-align : center !important ; }
.ALright { text-align : right !important ; }
.ALleft { text-align : left !important ; }

/* indent */
.indent {
	text-indent : -1em ;
	padding-left : 1em ;
}
.bo{ font-weight: bold !important; }

.f90{ font-size:90% !important;}
.f100{ font-size:100% !important;}
.f110{ font-size:110% !important;}

/*----------------------------------------------
	img
---------------------------------------------*/
a img {
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
a:hover img {
	filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}

@media screen and (max-width: 640px){
	img.max_img {
		width: 100%;
		height: auto;
	}
}

/*----------------------------------------------
	width
---------------------------------------------*/
.w400 {
	width: 400px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
@media screen and (max-width: 640px){
	.w400 {
		width: 100%;
	}
}

/*----------------------------------------------
	float
---------------------------------------------*/
.fl { float: left; }
.fr { float: right; }

@media screen and (max-width: 640px){
	.fl,
	.fr {
		float: none;
	}
}

/*----------------------------------------------
	column
---------------------------------------------*/
.col_tbl {
	display: table;
}
	.col_tbl2 div {
		display: table-cell;
		vertical-align: middle;
	}

/*----------------------------------------------
	list
---------------------------------------------*/
.list_num-a, .list_disc, .list_circle {
	padding-left: 30px;
}
.list_num-a li {
   list-style-type: decimal !important;
}
.list_disc li {
	list-style-type: disc !important;
}
.list_circle li {
	list-style-type: circle !important;
}

/*----------------------------------------------
	inner　中ページ
---------------------------------------------*/
.inner #contents {
	padding-bottom: 60px;
}
.inner #main_blk {
	width: 720px;
}

/*スラッグ名phoneの子カテゴリへ税抜表示*/
.inner #main_blk h1{
	position: relative;
}
.inner #main_blk h1 span.zeinuki{
	position: absolute;
	text-align: right;
	font-weight: bold;
	font-size:16px;
	left: 480px;
	top: 14px;
}

.inner #side_blk,
.inner #side_blk_ver02 {
	width: 230px;
}
	/* main_blk
	------------------------------------- */
	.inner #side_blk {
		/*padding: 0 20px;*/
	}

	/* side_blk
	------------------------------------- */
	#side_blk .nav_ttl {
		font-weight: bold;
		background: #FCC956;
		padding: 10px 15px;
		border-bottom: 2px solid #F37800;
	}
	#side_blk ul li {
		background: #FFF4D4;
		border-bottom: 1px solid #F3DBB3;
	}
	#side_blk ul li:last-child {
		border-bottom: none;
	}
	#side_blk ul li a {
		display: inline-block;
		background: #FFF4D4;
		background-size: 7px 8px,100% 100%;
		-webkit-background-size: 7px 8px,100% 100%;
		-moz-background-size: 7px 8px,100% 100%;
		-o-background-size: 7px 8px,100% 100%;
		-ms-background-size: 7px 8px,100% 100%;
		padding: 10px 10px 10px 10px;
		color: #333;
		-webkit-transition: background .2s linear;
    	-moz-transition: background .2s linear;
    	-o-transition: background .2s linear;
		min-width: 179px;
		width: -o-calc(100% - 51px);
    	width: calc(100% - 51px);
	}
	#side_blk ul li ul li {
		background: #fff8ea;
		border-bottom: 1px solid #F3DBB3;
	}
	#side_blk ul li ul li:last-child {
		border-bottom: none;
		background: #FFF8EA;
	}
	.inner #side_blk_ver02 ul li a{
		padding-left: 0 !important;
	}

	/* 第二階層 */
	#side_blk ul li ul li a{
		display: inline-block;
		background: #FFFFFF;
		background-size: 7px 8px,100% 100%;
		-webkit-background-size: 7px 8px,100% 100%;
		-moz-background-size: 7px 8px,100% 100%;
		-o-background-size: 7px 8px,100% 100%;
		-ms-background-size: 7px 8px,100% 100%;
		padding: 10px 10px 10px 10px;
		color: #333;
		/*border-bottom: 1px solid #F3DBB3;*/
		-webkit-transition: background .2s linear;
    	-moz-transition: background .2s linear;
    	-o-transition: background .2s linear;
		/*width: 179px;*/
		min-width: 179px;
		width: -o-calc(100% - 51px);
    	width: calc(100% - 51px);
		max-height: 300px;
		vertical-align: middle;
	}
		
	#side_blk ul#archives li a{
		min-width: 159px;
		padding: 10px 0px 10px 0px;
		background: #fff8ea;
		background-image: url(../images/_icon/icon_arrow04.png);
		background-size: 7px 8px,100% 100%;
		background-repeat: no-repeat;
		background-position: 18px;
		padding-left: 61px;
		width: -o-calc(100% - 61px);
    	width: calc(100% - 61px);
		max-height: 300px;	
	}
	#side_blk ul#archives li.archive-year a{
		min-width: 179px;
		padding: 10px 10px 10px 30px;
		background: #fff8ea;
		background-image: url(../images/_icon/icon_arrow04.png);
		background-size: 7px 8px,100% 100%;
		background-repeat: no-repeat;
		background-position: 18px;
		padding-left: 41px;
		width: -o-calc(100% - 51px);
    	width: calc(100% - 51px);
		max-height: 300px;	
	}
	#side_blk ul#archives li a .archive-month{
		display: inline;
	}

	#side_blk ul#archives li a:hover{
		background-color: #FFE493;
	}


	/* IMPORTANT: current links clicked styles
	--------------------------------------------------------- */
	#side_blk ul li.current_page_item > a,
	#side_blk ul li.current-cat > a{
		font-weight: bold;
	}

	#side_blk ul li.page_item_has_children > ul,
	#side_blk ul li.cat-item-has-children > ul {
		display: none;
	}

	#side_blk ul li.current_page_ancestor > ul,
	#side_blk ul li.current-cat-ancestor > ul {
		display: block;
	}

	#side_blk ul li.depth0 > ul a {
		background-color: #fff8ea;
	}

	#side_blk ul li.depth1 > ul a {
		background-color: #fffdf9;
	}

	#side_blk ul li.depth2 > ul a {
		background-color: #fff;
	}

	#side_blk ul li a.normal-link {
		background-image: url(../images/_icon/icon_arrow04.png);
		background-repeat: no-repeat;
		background-position: 18px;
		padding-left: 41px;
		width: -o-calc(100% - 51px);
		width: calc(100% - 51px);
	}

	#side_blk ul li a.normal-link:hover,
	#side_blk ul li a:hover,
	#side_blk ul li ul li a:hover {
		background-color: #FFE493;
	}


	/*バナーブロックのサイドナビバージョン*/
	#side_blk_ver02 ul li{
		margin-bottom: 5px;
	}
	@media screen and (max-width: 640px){
		#side_blk_ver02,
		#side_blk ul#archives,
		#side_blk .nav_ttl.archivesttl{
			display: none;
		}
	}

	/* IMPORTANT: span.toggle width and paddings must be set
	--------------------------------------------------------- */
	span.toggle, span.spn-link {
		width: 6px;
		display: inline-block;
		padding: 10px 10px 10px 15px;
		cursor: pointer;
	}
	span.toggle.close img, span.spn-link img  {
		width: 12px;
		vertical-align: middle;
	}
	span.toggle.open {
		width: 8px;
		padding: 10px 10px 10px 13px;
	}
	span.toggle.open img {
		width: 12px;
		vertical-align: middle;
	}
	span.toggle.close:nth-child(2),
	span.toggle.open:nth-child(2){
		display: none;
	}

/*ul#archives {
	width: 230px;
	float: left;
	padding: 0 10px 15px;
}

#archives li {
	padding: 5px 5px 5px 20px;
}

#archives li.archive-year {
	padding-left: 5px;
}*/

@media screen and (max-width: 640px){

	/*	中ページ共通
	---------------------------------------------*/
	.inner #contents {
		padding-bottom: 15px;
	}
	.inner #main_blk,
	.inner #side_blk {
		width: 100%;
    	-webkit-box-sizing: border-box;
    	        box-sizing: border-box;
		padding: 0 10px 15px;
	}
	.inner #editor_blk {
		padding: 0 10px;
	}

	.inner #main_blk h1{
		position: relative;
		padding-top: 20px;
	}

	/*  オプション　光ギガ電話　各詳細ページ
	------------------------------------- */
	/*スラッグ名phoneの子カテゴリへ税抜表示*/
	.inner #main_blk h1 span.zeinuki{
		position: relative;
		text-align: left;
		display: inline-block;
		font-size: 14px;
		top: -5px;
		left: 0px;
	}
}


/*----------------------------------------------
	title　中ページのタイトル
---------------------------------------------*/
.inner #page_ttl_blk  {
	background: url(../images/bg_page_ttl01.png)left center no-repeat,url(../images/bg_page_ttl02.png)right center no-repeat;
	background-color: #FCC956;
	padding: 20px;
}
.inner #page_ttl {
	font-size: 28px;
	font-weight: bold;
}
.inner h1 {
	font-size: 26px;
	border-bottom: 2px solid #FCCA5A;
	margin-bottom: 30px;
}
.inner h2.normal {
	font-size: 22px;
	background: #F1F1F1 url(../images/bg_ttl_h2_normal.gif) 0 center no-repeat;
	padding: 8px 8px 8px 20px;
	background-size: 11px 11px,100% 100%;
	line-height: 1.5;
	margin-bottom: 25px;
}
.inner h2.ver_bk{
	font-size: 20px;
	font-weight: bold;
	text-align: left;
	line-height: 1.2;
	padding: 10px 20px;
	background: #555555;
	color: #FFFFFF;
	margin-bottom: 20px;
}
/*ie10以下*/  
.inner h2.ver_bk {
	padding: 15px 20px 9px\9;
}  
/*ie11*/  
@media all and (-ms-high-contrast:none){  
*::-ms-backdrop, .inner h2.ver_bk{  
	padding: 15px 20px 9px;
}  
} 
/*edge*/  
@supports (-ms-accelerator:true) {  
.inner h2.ver_bk {  
	padding: 15px 20px 9px;
}  
}
.inner h3.normal {
	font-size: 20px;
	color: #FB8000;
	margin-bottom: 10px;
}
.inner .optiondetail h3.add_point{
	border-bottom: none;
	font-size: 20px;
	position:relative;
}
.inner h3.ver_01,
.inner h4.ver_01 {
	position: relative;
	width: 100%;
	font-size: 18px;
	font-weight: bold;
	border-bottom: 1px dotted #aaaaaa;
	margin-bottom: 10px;
	z-index: 1;
}
.inner h3.ver_01{
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 15px;
}
.inner h3.ver_01:before,
.inner h4.ver_01:before {
	position:absolute;
	content: "";
	display: block;
	top:-4px;
	left: 0;
	border-bottom: 1px solid #FCC955;
	padding-bottom: 4px;
	min-height: 100%;
	width: 20%;
}
.inner h5 {
	background: #EEE;
	/*font-weight: normal !important;*/
	font-weight: bold;
	padding: 5px 15px;
	margin-bottom: 10px;
}
.inner h6 {
	margin-bottom: 10px;
}
.inner h1#ttl_logo {
	border-bottom: none;
	margin-bottom: 0;
}

.inner ul.list-b li{
	margin:0 0 10px 0;
}

.inner ul.list-b li a{
	background: url(../images/_icon/icon_arrow03.png) 0 center no-repeat;
	background-size: 5px 8px;
	padding-left: 20px;
}
	
	
@media screen and (max-width: 640px){
	.inner #page_ttl_blk  {
		background: #FCC956;
		padding: 15px;
		margin-top: 60px;
	}
	.inner #page_ttl {
		font-size: 23px;
		font-weight: bold;
	}
	.inner h1 {
		font-size: 22px;
		border-bottom: 2px solid #FCCA5A;
		margin-bottom: 30px;
	}
	.inner h2.normal {
		font-size: 18px;
		background: #F1F1F1 url(../images/bg_ttl_h2_normal.gif) 0 center no-repeat;
		padding: 8px 8px 8px 20px;
		background-size: 11px 11px,100% 100%;
		line-height: 1.5;
		margin-bottom: 25px;
	}
	.inner h3.normal {
		color: #FB8000;
		margin-bottom: 10px;
	}
	.inner .optiondetail h3.add_point{
		font-size: 18px;
		position:static;
	}

	/*光GIGAとは*/
	#about.inner #page_ttl_blk,
	#about.inner #page_ttl{
		display: none;
	}
	
	.inner .optiondetail img.resp{
		width: 100%;
		height: auto;
	}
}






/*----------------------------------------------
	中ページ共通
---------------------------------------------*/

/*中ページの詳細ボタン　01*/
.inner .detail_btn_01 a{
	display: inline-block;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    padding: 7px 0;
    /* max-width: 280px; */
	color: #333;
	width: 46%;
	clear: both;
	margin-left: 12%;
	background:#FFEB9E url(../images/_icon/icon_arrow03_2.png) 95% center no-repeat;
	background-size: 16px 10px,100% 100%;
}

/*中ページの詳細ボタン　02*/
.inner ul.detail_btn_02 li{
	padding: 10px;
	display: inline-block;
	width: 46%;
}
.inner ul.detail_btn_02 li:last-child{
	padding-right: 0px;
}
.inner ul.detail_btn_02 li a{
	display: inline-block;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    padding: 7px 0;
	color: #333;
	clear: both;
	width: 100%;
	background:#FFEB9E url(../images/_icon/icon_arrow03.png) 95% center no-repeat;
	background-size: 10px 16px,100% 100%;
}
/*ie10以下*/  
.inner ul.detail_btn_02 li a {
	padding: 9px 0 5px 0\9;
	font-size: 16px;
}  
/*ie11*/  
@media all and (-ms-high-contrast:none){  
*::-ms-backdrop, .inner ul.detail_btn_02 li a {  
	padding: 9px 0 5px 0; 
	font-size: 16px;
}  
} 
/*edge*/  
@supports (-ms-accelerator:true) {  
.inner ul.detail_btn_02 li a {  
padding: 9px 0 5px 0; 
}  
}
_::content, _:future, .inner ul.detail_btn_02 li a:not(*:root) { 
  font-size: 18px;
}
@-moz-document url-prefix() {
  .inner ul.detail_btn_02 li a {
    font-size: 18px;
  }
}

/*アイコンと説明の部分*/
.inner .optiondetail .del .fl{
	width: 20%;
	padding-right: 20px;
}
.inner .optiondetail .del .fr{
	width: 77%;
}

/*「point」のブロック*/
.inner .p_ttl{
	background: #FCC954;
	font-weight: bold;
	padding: 5px 0;
	text-align: center;
	font-size: 20px;
}
.inner .optiondetail .dott_type {
	border: 1px dotted #DDD;
	margin-bottom: 20px;
}
.inner .optiondetail .dott_type dd {
	padding: 20px;
	text-align: center;
}
.inner .optiondetail .dott_type .sub_ttl {
	font-size: 18px;
	font-weight: bold;
}
.inner .p_ttl span {
	padding: 5px;
	font-size: 30px;
}

/*月額料金など中ページの表組のベース*/
.inner .optiondetail table.add_tb02,
.inner .optiondetail table.add_tb03,
.inner .optiondetail table.add_tb04
{
	width: 100%;
	margin-bottom: 20px;
}
.inner .optiondetail table.add_tb02 th,
.inner .optiondetail table.add_tb02 td,
.inner .optiondetail table.add_tb03 td,
.inner .optiondetail table.add_tb04 td{
	border: 1px solid #666;
	padding: 15px;
	font-size: 20px;
	vertical-align: middle;
}
.inner .optiondetail table.add_tb03 td,
.inner .optiondetail table.add_tb04 td{
	font-size: 16px;
}
.inner .optiondetail table.add_tb02 th {
	font-weight: normal;
	text-align: center;
	width: 45%;
	background: #EFEFEF;
}
.inner .optiondetail table.add_tb02.wh30 th{
	width: 30%;
}
.inner .optiondetail table.add_tb02.wh30 td{
	text-align: left;
	font-size: 16px;
	font-weight: normal;
}

.inner .optiondetail table.add_tb02 td {
	text-align: right;
}
.inner .optiondetail table.add_tb02 td .s1 {
	font-size: 35px;
	font-weight: bold;
	color: #FF4000;
	vertical-align: -2px;
	padding:0 2px;
}
.inner .optiondetail table.add_tb03 td{
	width: 50%;
}
.inner .optiondetail table.add_tb03 td span:nth-child(odd),
.inner .optiondetail table.add_tb04 td span:nth-child(odd)
{
	display: block;
	text-align: left;
	float: left;
}
.inner .optiondetail table.add_tb03 td span:nth-child(even),
.inner .optiondetail table.add_tb04 td span:nth-child(even){
	display: block;
	text-align: right;
}
.inner .optiondetail table.tbextra th, .inner .optiondetail table.tbextra td {
	font-size: 100%;
	padding: 0;
	border: none;
	background: none;
}
.inner .optiondetail table.tbextra th {
	width: 50%;
	text-align: left;
}

/*月額料金の注意書き*/
.inner .optiondetail ul.cau_v01 li{
	display: inline-block;
	margin: 0;
	padding: 0;
	vertical-align: text-top;
}
.inner .optiondetail ul.cau_v01 li:nth-child(even){
	word-wrap: break-word;
	width: 95%;
}
.inner .optiondetail ul.cau_v01 li:nth-child(odd){
	padding-right: 3px;
}
.inner .optiondetail ul.cau_v01 a{
	text-decoration: underline;
}

/*「option」のタイトル*/
.inner .optiondetail h3.add_point span.s1{
	font-size: 90%;
	padding: 2px 9.5px;
	position: absolute;
	top: 0;
	left: 0;
	/*width: 70px;*/
	/*height: 34px;*/
	background: #FCC956;
	z-index: 10;
}
.inner .optiondetail h3.add_point span.sdesc {
	padding-left: 110px;
	display: block;
}
.inner .optiondetail .add_point span.orange {
	color: #f3b100;
	font-weight: bold;
}
.inner .optiondetail .droplist h3.add_point {
	float: left;
	/*width: 590px;*/
	margin-bottom: 0;
}

/*「option」のタイトルのドロップダウンリスト機能群*/
.title {
	height: 40px;
	background: #6bb170;
	color: white;
	text-align: center;
}
.droplist li {
	list-style-type: none;
	clear: both;
	margin-left: 0 !important;
}
.droplist li img.arrow {
	float: right;
	margin-top: 4px;
	margin-right: 10px;
}
.droplist li.a {
	cursor: pointer;
	overflow: hidden;
	list-style-type: none !important;
}
.droplist li.b {
	display: none;
	padding: 20px 0;
	list-style-type: none !important;
}
.rotate {
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	    transform: rotate(90deg);
}

/*「option1」のドロップダウンの「ご契約サービスに関するお問い合わせ先」*/
.inner .optiondetail .bhead {
	font-weight: bold;
	/*margin-bottom: 10px;*/
}
.inner .optiondetail .telnum {
	font-size: 30px;
	font-weight: bold;
	background: url(../images/icon_telnum.png) left no-repeat;
	padding-left: 25px;
}

/* PDFダウンロードボタン */
.inner .optiondetail .pdf a {
	display: block;
	font-size: 20px;
	font-weight: bold;
	color: #333;
	margin: 0 auto;
	text-decoration: none;
	z-index: 1;
	padding:10px;
	border:1px solid #eee;
	background:url("../images/_icon/i_dl.png") 97% 15px no-repeat;
}
.inner .optiondetail .pdf a:hover {
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	background:#efefef url("../images/_icon/i_dl_o.png") 97% 15px no-repeat;
	border:1px solid #999;
}
.inner .optiondetail p.pdf a:before {
	content: "";
    display: inline-block;
    width: 5%;
    height: 24px;
    background:url("../images/_icon/i_pdf.png") 5px -2px no-repeat;
    background-size: 20px 24px;
    vertical-align: middle;
}

/*四角いわくを書くとき*/
.sblst{
	font-size: 18px;
}
.sblst span.sikaku{
	padding:5px 10px;
	font-size: 14px;
	border: 1px solid #f3b100;
	color: #f3b100;
}
.sblst span.sikaku+span{
	padding-left:10px;
	vertical-align: -7%;
}

/*横並び*/
.inner .optiondetail .typ_img01{
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
.inner .optiondetail .typ_img01 li{
	display: inline-block;
	width: 28%;
	text-align: center;
	vertical-align: top;
	background: #FFF8E4;
	margin:0 1%;
	min-height: 143px;
	padding: 10px;
	margin-bottom: 20px;
}
.inner .optiondetail .typ_img01 p:first-child{
	margin-bottom: 10px;
}

/*Add CSS 20170807*/
.inner .optiondetail .typ_img02{
	width: 100%;
	margin: 0 auto;
	font-size: 0;
	text-align: center;
}
.inner .optiondetail .typ_img02 li{
	display: inline-block;
	width: 20%;
	text-align: center;
	vertical-align: top;
	/*margin: 0 1%;*/
	margin: 0;
	min-height: 140px;
	padding: 10px;
	margin-bottom: 20px;

	font-size: 12px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;;
	
}
.inner .optiondetail .typ_img02 h3 {
	margin-bottom: 5px;
	font-weight: bold;
}
.inner .optiondetail .typ_img02 p.textArea {
	text-align: left;
}
.inner .optiondetail .typ_img02 p:first-child{
	margin-bottom: 10px;
}

.inner .optiondetail .boxlayout01 {
	display: table;
	width: 100%;
	margin: 20px 0 0;
}
.inner .optiondetail .boxlayout01 .boxlayout01_img {
	display: table-cell;
	width: 40%;
	padding: 0 10px;
	text-align: center;
	vertical-align: top;
}
.inner .optiondetail .boxlayout01 .boxlayout01_img img {
	max-width: 100%;
	height: auto;
}
.inner .optiondetail .boxlayout01 .boxlayout01_text {
	display: table-cell;
	width: 60%;
	text-align: left;
	vertical-align: top;
}

.inner .optiondetail table.systemreq {	/* らくらくバックアップ > 動作環境テーブル */
	border: 1px solid #333;
	border-collapse: collapse;
}

.inner .optiondetail table.systemreq th,
.inner .optiondetail table.systemreq td {
	padding: 10px;
	font-size: 12px;
	line-height: 1.5em;
	border: 1px solid #333;
}
.inner .optiondetail table.systemreq th {
	width: 30%;
}
.inner .optiondetail table.systemreq td {
	width: 70%;
}
.inner .optiondetail .price_link {
}
.inner .optiondetail .price_link a {
	color: #00a;
}
.inner .optiondetail .price_link a:after {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	background: url(../images/_icon/icon_16x16_pdf.png) no-repeat center center;
	padding: 0 0 0 5px;
}

table.amountdata {	/* 光ギガ ダブル定額・ダブル定額パック > 通信料目安テーブル */
	margin: 0 0 10px 0;
	border: 1px solid #ccc;
}
table.amountdata thead {
	border: 1px solid #ccc;
}
table.amountdata thead th {
	padding: 10px 0;
	text-align: center;
	font-size: 10px;
	vertical-align: middle !important;
	border: 1px solid #ccc;
}
table.amountdata thead th span {
	display: block;
	font-size: .8em;
}
table.amountdata thead img {
	display: block;
	width: 50px;
	margin: 0 auto 10px auto;
}
table.amountdata tbody th {
	padding: 10px;
	text-align: center;
	vertical-align: middle !important;
	border: 1px solid #ccc;
}
table.amountdata tbody td {
	width: 20%;
	padding: 10px 0;
	text-align: center;
	vertical-align: middle !important;
	border: 1px solid #ccc;
}


/*Add CSS 20170508*/
.inner .optiondetail .btn330 {
	width: 330px;
	margin: 0 auto;
}
.inner .optiondetail h3.orange:before {
	    border-bottom: 4px solid #F37800;
}
.inner .optiondetail h3.orange {
	    border-bottom: 3px solid #eee;
}
.inner .optiondetail .faq_list dl {
	display: grid;
	margin-bottom: 30px;
}
.inner .optiondetail .faq_list dl dd {
	border: 1px solid #FCC956;
}
.inner .optiondetail .faq_list dl dt {
	font-weight: bold;
	background: #FCC956;
}
.inner .optiondetail .faq_list dl dt,　.inner .optiondetail .faq_list dl dd {
	display: inline-block;
	width: 100%;
}
.inner .optiondetail .faq_list dl dt .q {
    float: left;
	color: #FFF;
    font-size: 14px;
	font-weight: bold;
    padding: 2px 5px;
	margin-top: 15px;
    margin-left: 15px;
	margin-right: 10px;
    margin-bottom: 15px;
    background: #F37800;
}
.inner .optiondetail .faq_list dl dd .a {
    float: left;
	color: #FFF;
    font-size: 14px;
	font-weight: bold;
    padding: 2px 5px;
    margin-top: 15px; 
    margin-left: 15px;
    margin-right: 10px;
    margin-bottom: 15px;
	background: #FCC956;
}
.inner .optiondetail .faq_list dl .dsc {
    display: block;
	padding: 15px 15px 15px 55px;
}
.inner .optiondetail .faq_list dl dt .dsc {
	color: #FFF;
}

.inner .optiondetail .faq_list dl dd .dsc {
    
}

.inner .box_acct {
	border: 3px solid #EEE;
	text-align: center;
	padding: 30px 0;
}
.inner .box_acct dt {
	background: #FAB71F;
	color: #FFF;
	display: inline-block;
	font-weight: bold;
	border-radius: 5px;
    padding: 8px 30px;
	font-size: 18px;
	position: relative;
}
.inner .box_acct dt:before {
	content: '';
    position: absolute;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-top: 10px solid #FAB71F;
	bottom: -20px;
	left: 0;
    right: 0;
    width: 0;
	margin: 0 auto;
}
.inner .box_acct dd {
	font-size: 23px;
	font-weight: bold;
	color: #FAB71F;
	margin-top: 15px;
}
.inner .optiondetail .v2.add_tb02 td {
	font-size: 15px;
	text-align: left;

}
.inner .optiondetail .yellow-bx {
	background: #FEFAEB;
	padding: 20px;
}
.inner .optiondetail .wroot_div {
	vertical-align: top;
	width: 300px;
}

.inner .optiondetail .wroot_div .green {
	font-size: 20px;
	color: #529052;
	font-weight: bold;
}

@media screen and (max-width: 640px){

	/*	中ページ
	---------------------------------------------*/
	/*スマホ用で表示させないとき*/
	.inner .spnone{
		display: none;
	}

	/*アイコンと説明の部分*/
	.inner .optiondetail .del .fl,
	.inner .optiondetail .del .fr{
		float: none;
		width: 100%;
		padding: 0;
		text-align: center;
	}
	.inner .optiondetail .del .fl{
		padding-bottom: 10px;
	}

	/*月額料金など中ページの表組のベース*/
	.inner .optiondetail table.tbextra th, .inner .optiondetail table.tbextra td, .inner .optiondetail table.add_tb02 th, .inner .optiondetail table.add_tb02 td {
		width: 100%;
		float: left;
		text-align: center;
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
		/*margin-bottom: 10px;*/
	}
	.optiondetail table.add_tb02.btn_box tr.ex td{
		margin-bottom: 10px;
	}
	.optiondetail table.add_tb02 th:first-child {
		border-bottom: none;
	}
	.inner .optiondetail table.tbextra tr:first-child {
		margin-bottom: 15px;
        display: table;
	}

	/*月額料金の注意書き*/
	.inner .optiondetail ul.cau_v01 li:nth-child(even){
		width: 90%;
	}
	.inner .optiondetail ul.cau_v01 li:nth-child(odd){
		padding-right: 3px;
	}

	/*「option」のタイトル*/
	.inner .optiondetail h3.add_point span.s1 {
		display: block;
		width: 80px;
		text-align: center;
		margin-bottom: 10px;
	}
	.inner .optiondetail h3.add_point span.s1 {
		float: none;
	}
	.inner .optiondetail h3.add_point span.sdesc {
		padding-left: 0;
		padding-top: 0;
	}
	.inner .optiondetail h3.add_point{
		width: 90%
	}
	.inner .optiondetail h3.add_point span.s1{
		display: none;
	}
	.inner .optiondetail h3.add_point span.sdesc {
		display: block;
	}

	/*PDFのアイコン*/
	.inner .optiondetail .pdf a {
		background:none;
		font-size: 16px;
	}
	.inner .optiondetail p.pdf a:before{
		width: 10%;
	}
	.inner .optiondetail .pdf a:hover {
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		background:#efefef;
		border:1px solid #999;
	}
	.inner .detail_btn_01 a{
		width: 100%;
		margin-left: 0;
	}
	.inner ul.detail_btn_02 li{
		padding: 5px 0;
	    width: 100%;
	}
	.inner ul.detail_btn_02 li a{
		padding: 7px 15%;
		width: 70%;
	}

	.inner h2.ver_bk,
	.inner h3.ver_01,
	.inner .optiondetail .dott_type dd{
		font-size: 18px;
	}
	.inner .p_ttl,
	.inner .detail_btn_01 a,
	.inner ul.detail_btn_02 li a,
	.inner .optiondetail table.add_tb02, .inner .optiondetail table.add_tb03, .inner .optiondetail table.add_tb04{
		font-size: 16px;
	}

	.inner .optiondetail .typ_img01 li{
		width:90%;
		margin: 0;
	}

	/*add CSS 20170807*/
	.inner .optiondetail .typ_img02 li {
		width: 90%;
		margin: 0;
	}

	.inner .optiondetail .boxlayout01 {
		display: block;
	}
	.inner .optiondetail .boxlayout01 .boxlayout01_img {
		display: block;
		width: 100%;
	}
	.inner .optiondetail .boxlayout01 .boxlayout01_text {
		display: block;
		width: 100%;
	}
	/**/

	.inner .scroll{
		width: 100%;
		overflow-x: scroll;
	}
	.inner .scroll::-webkit-scrollbar{　　/*tableにスクロールバーを追加*/
	 height: 5px;
	}
	.inner .scroll::-webkit-scrollbar-track{　　/*tableにスクロールバーを追加*/
	 background: #F1F1F1;
	}
	.inner .scroll::-webkit-scrollbar-thumb {　　/*tableにスクロールバーを追加*/
	 background: #BCBCBC;
}
}


/*----------------------------------------------
	button
---------------------------------------------*/
/* .btn_orage01 */
.btn_orage01 a {
	background: #F97305 url(../images/_icon/icon_arrow01.png) 95% center no-repeat;
	border: 3px solid #F97305;
}
.btn_orage01 a:hover {
	background: #FFC926 url(../images/_icon/icon_arrow01.png) 95% center no-repeat;
}
/* .btn_blue01 */
.btn_blue01 a {
	background: #1F71BF url(../images/_icon/icon_arrow01.png) 95% center no-repeat;
	border: 3px solid #1F71BF;
}
.btn_blue01 a:hover {
	background: #4FA1F0 url(../images/_icon/icon_arrow01.png) 95% center no-repeat;
}
/* .btn_orange01 */
.btn_orangena01 a {
	background: #F97305 url(../images/_icon/icon_arrow01.png) 95% center no-repeat;
	border: 3px solid #F97305;
}
.btn_orangena01 a:hover {
	background: #FFC926 url(../images/_icon/icon_arrow01.png) 95% center no-repeat;
}
/* .btn_green01 */
.btn_green01 a {
	background: #25974B url(../images/_icon/icon_arrow01.png) 95% center no-repeat;
	border: 3px solid #25974B;
}
.btn_green01 a:hover {
	background: #3ED370 url(../images/_icon/icon_arrow01.png) 95% center no-repeat;
}
/* .btn_blue02（サービス＜提供エリア） */
.btn_blue02 a {
	background: #1F71BF url(../images/_icon/icon_arrow07.png) 95% center no-repeat;
}
.btn_blue02 a:hover {
	background: #4FA1F0 url(../images/_icon/icon_arrow07.png) 95% center no-repeat;
}
/* .btn_blue02（サービス＜提供エリア） */
.btn_orage02 a {
	background: #F97305 url(../images/_icon/icon_arrow07.png) 95% center no-repeat;
}
.btn_orage02 a:hover {
	background: #FFC926 url(../images/_icon/icon_arrow07.png) 95% center no-repeat;
}

.btn_yellow01 a {
	background:#FFEB9E url(../images/_icon/icon_arrow03.png) 95% center no-repeat;
	border: 3px solid #FFEB9E;
}
.btn_yellow01 a:hover {
	background:#FFC926 url(../images/_icon/icon_arrow03.png) 95% center no-repeat;
}


.btn_green01 a,
.btn_orage01 a,
.btn_blue01 a,
.btn_orangena01 a,
.btn_orage02 a,
.btn_blue02 a
{
	font-size: 20px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	color: #FFF;
	display: block;
	padding: 10px 0;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	background-size: 10px 16px,100% 100% !important;
}
.btn_yellow01 a {
	display: block;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    padding: 7px 0;
	color: #333;
	clear: both;
	width: 100%;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	background-size: 10px 16px,100% 100%;
	max-width: 330px;
	margin: 0 auto;
}


@media screen and (max-width: 640px) {
	.btn_green01 a,
	.btn_orage01 a,
	.btn_blue01 a,
	.btn_orangena01 a
	.btn_orage02 a,
	.btn_blue02 a,
	.btn_yellow01 a{
		width: 68%;
		position: static;
		-webkit-box-sizing: content-box;
		        box-sizing: content-box;
		font-size: 100%;
		padding:0 15%;
		font-size: 16px;
	}
	.btn_green01 a:hover,
	.btn_orage01 a:hover,
	.btn_blue01 a:hover,
	.btn_orangena01 a:hover,
	.btn_orage02 a:hover,
	.btn_blue02 a:hover,
	.btn_yellow01 a:hover{
		top: 0;
		left: 0;
		-webkit-box-shadow: none;
		        box-shadow: none;
		background-size: 10px 16px,100% 100%;
	}
	.btn_orage02 a,
	.btn_blue02 a,
	.btn_orage02 a:hover,
	.btn_blue02 a:hover{
		font-size: 16px;
		padding: 10px 0;
		width: auto;
	}
}
.btn_greenline01 {
	border: 1px solid #539053;
}
.btn_greenline01 a {
	display: block;
	color: #529052;
	font-weight: bold;
	padding: 10px;
	background: url(../images/icon_btn_greenline.png) 95% center no-repeat;
	    padding: 10px 20px 10px 4px;
}


/*----------------------------------------------
	clearfix
---------------------------------------------*/

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}