@charset "utf-8";

/* リセット */

.usual div, .usual span, .usual object, .usual iframe,
.usual h1, .usual h2,.usual h3, .usual h4, .usual h5, .usual h6, 
.usual p, .usual blockquote, .usual pre,
.usual abbr, .usual address, .usual cite, .usual code,
.usual del, .usual dfn, .usual em, .usual img, .usual ins, 
.usual kbd, .usual q, .usual samp,
.usual small, .usual strong, .usual sub, .usual sup, .usual var, .usual b, .usual i, 
.usual dl, .usual dt, .usual dd, .usual ol, .usual ul, /*.usual li,*/
.usual fieldset, .usual form, .usual label, .usual legend,
/*.usual table, .usual caption, .usual tbody, .usual tfoot, .usual thead, .usual tr, .usual th, .usual td*/
.usual article, .usual aside, .usual canvas, .usual details, .usual figcaption, .usual figure, 
.usual footer, .usual header, .usual hgroup, .usual menu, .usual nav, .usual section, .usual summary,
.usual time, .usual mark, .usual audio, .usual video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    vertical-align:baseline;
    line-height:1.9em;
	box-sizing: border-box;	
	font-size: 1em;
	overflow: hidden;
}

.usual img {
	/*vertical-align: text-bottom;*/
	vertical-align:bottom;
	-ms-interpolation-mode: bicubic;
}

.usual ul, .usual ol{
	padding-left: 1.5em;
	margin: 10px 0;
}
.usual dl{
	margin: 10px 0;	
}
.usual ul li{
}
.usual ul li, .usual ol li{
	margin-top: 8px;
	margin-bottom: 8px;
}
.usual ul li:first-child, .usual ol li:first-child{
	margin-top: 0px!important;
}
.usual ul li:last-child, .usual ol li:last-child{
	margin-bottom: 0px!important;
}

/* 基本 */

section.usual{
	width:1380px;
	padding: 0 40px;
	margin: 80px auto 0px;
	box-sizing: border-box;
	text-align: left;
	clear:both;
	overflow: hidden;	
}

@media only screen and (max-width: 1380px) {
	section.usual{width:100%;}
}

/*2カラム*/
.usual div.row{
	box-sizing: border-box;
	position: static!important;
	display: flex!important;
	text-align: left;
	flex-wrap: nowrap;
}

.usual div.row > div{
	display: inline-block;
	box-sizing: border-box;
	width: 49.5%!important;
}

.usual div.row > div h3{
	font-size: 1.4em;
}

.usual div.row > div > p{
	font-size: 1.1em;
}

.usual div.row > div img{
	width: 100%;
}

/* TOP画像 */

.usual_top{
	width: 100%;
	text-align: center;
	background-color: #000000;
	margin: 0!important;
	padding: 0!important;
	overflow: hidden;
}

.usual_top p{	
	margin: 0!important;
	padding: 0!important;
	overflow: hidden;
}
.usual_top img{
	margin: 0;
	width: 70%;	
	vertical-align:top;
}

@media only screen and (max-width: 1000px) {
	.usual_top img{width:100%;}
}


/*小さな画像 小さいマークとその説明文などに使用*/
div.smallwrap{
	box-sizing: border-box;	
	display: table;
}

div.smallwrap div:first-child{
	display: table-cell;
	text-align: left;
	width: 6%;	
	vertical-align: top;
}

div.smallwrap div:last-child{
	display: table-cell;
	text-align: left;
	padding-left: 15px;
	box-sizing: border-box;
	width: 93%;	
	vertical-align: top;
}

/*上述よりも少しだけ大きい 小さいマークとその説明文などに使用*/
div.lsmallwrap{
	margin: 0 auto 40px;
	box-sizing: border-box;
	text-align: left;
	overflow: hidden;	
	display: table;
}

div.lsmallwrap div:first-child{
	display: table-cell;
	text-align: left;
	width: 20%;	
	vertical-align: top;
}

div.lsmallwrap div:last-child{
	display: table-cell;
	text-align: left;
	padding-left: 15px;
	box-sizing: border-box;
	width: 79%;	
	vertical-align: top;
}

/****************************************
   汎用的スタイル
****************************************/

/* ============================================================
メインビジュアルmarginリセット
============================================================ */
.page-product-hero{ 
	margin-top: 0!important;
	margin-bottom: 0!important;
}
.page-product-hero p{ 
	margin-top: 0!important;
	margin-bottom: 0!important;
	text-align:center;	
	}

.l-container{
	clear: both;
}
/* ============================================================
メインビジュアル1枚画像の場合
============================================================ */
.mainvisual_one,
.mainvisual_one h1,
.mainvisual_one p{
	width: 100%;
	text-align: center;
	margin: 0!important;
	padding: 0!important;
	overflow: hidden;
}

.mainvisual_one img{
	margin: 0;	
	vertical-align:top;
}

@media only screen and (max-width: 1530px) {
.mainvisual_one img{width:100%;}
}

/* ============================================================
アウトライン
============================================================ */
.content_wrapper1440,
.content_wrapper1300,
.content_wrapper1120{
	overflow: hidden;
	box-sizing: border-box!important;
	padding: 0 0px;
	margin: 0px auto 0;	
}
.content_wrapper1440{width: 1440px;}
.content_wrapper1300{width: 1300px;}
.content_wrapper1120{width: 1120px;}
@media only screen and (max-width: 1530px) {
.content_wrapper1440{padding: 0 40px 0; width: 100%;}}
@media only screen and (max-width: 1400px) {
.content_wrapper1300{padding: 0 40px 0; width: 100%;}}
@media only screen and (max-width: 1210px) {
.content_wrapper1120{padding: 0 40px 0; width: 100%;}}
@media only screen and (max-width: 1080px) {
.content_wrapper1440,.content_wrapper1300,.content_wrapper1120{padding: 0 30px;}}
@media only screen and (max-width: 835px) {
.content_wrapper1440,.content_wrapper1300,.content_wrapper1120{padding: 0 20px;}}

/* ============================================================
コンテンツ間のマージン
============================================================ */
.first_contents{margin-top:100px!important; margin-bottom:120px!important;}
.subsequent_contents{margin-top:0px!important; margin-bottom:120px!important;}
@media only screen and (max-width: 1250px) {
.first_contents{margin-top:80px!important; margin-bottom:95px!important;}
.subsequent_contents{margin-bottom:95px!important;}}
@media only screen and (max-width: 1000px) {
.first_contents{margin-top:70px!important; margin-bottom:80px!important;}
.subsequent_contents{margin-bottom:80px!important;}}
@media only screen and (max-width: 900px) {
.first_contents{margin-top:60px!important; margin-bottom:65px!important;}
.subsequent_contents{margin-bottom:65px!important;}}
@media only screen and (max-width: 835px) {
.first_contents{margin-top:35px!important; margin-bottom:50px!important;}
.subsequent_contents{margin-bottom:50px!important;}}

/*広めにとる場合*/
.first_contents_wide{margin-top:100px!important; margin-bottom:160px!important;}
.subsequent_contents_wide{margin-top:0px!important; margin-bottom:160px!important;}
@media only screen and (max-width: 1250px) {
.first_contents_wide{margin-top:80px!important; margin-bottom:130px!important;}
.subsequent_contents_wide{margin-bottom:130px!important;}}
@media only screen and (max-width: 1000px) {
.first_contents_wide{margin-top:70px!important; margin-bottom:110px!important;}
.subsequent_contents_wide{margin-bottom:110px!important;}}
@media only screen and (max-width: 900px) {
.first_contents_wide{margin-top:60px!important; margin-bottom:90px!important;}
.subsequent_contents_wide{margin-bottom:90px!important;}}
@media only screen and (max-width: 835px) {
.first_contents_wide{margin-top:35px!important; margin-bottom:70px!important;}
.subsequent_contents_wide{margin-bottom:70px!important;}}

/*一番上の要素のTOPも広めにとる場合*/
.first_contents_mtwide{margin-top:140px!important; margin-bottom:160px!important;}
@media only screen and (max-width: 1250px) {
.first_contents_mtwide{margin-top:110px!important; margin-bottom:130px!important;}}
@media only screen and (max-width: 1000px) {
.first_contents_mtwide{margin-top:90px!important; margin-bottom:110px!important;}}
@media only screen and (max-width: 900px) {
.first_contents_mtwide{margin-top:75px!important; margin-bottom:90px!important;}}
@media only screen and (max-width: 835px) {
.first_contents_mtwide{margin-top:55px!important; margin-bottom:70px!important;}}

/*狭めにとる場合*/
.first_contents_narrow{margin-top:100px!important; margin-bottom:80px!important;}
.subsequent_contents_narrow{margin-top:0px!important; margin-bottom:80px!important;}
@media only screen and (max-width: 1250px) {
.first_contents_narrow{margin-top:80px!important; margin-bottom:60px!important;}
.subsequent_contents_narrow{margin-bottom:60px!important;}}
@media only screen and (max-width: 1000px) {
.first_contents_narrow{margin-top:70px!important; margin-bottom:50px!important;}
.subsequent_contents_narrow{margin-bottom:50px!important;}}
@media only screen and (max-width: 900px) {
.first_contents_narrow{margin-top:60px!important; margin-bottom:40px!important;}
.subsequent_contents_narrow{margin-bottom:40px!important;}}
@media only screen and (max-width: 835px) {
.first_contents_narrow{margin-top:35px!important; margin-bottom:30px!important;}
.subsequent_contents_narrow{margin-bottom:30px!important;}}

/*一番上の要素のTOPも狭めにとる場合*/
.first_contents_mtnarrow{margin-top:80px!important; margin-bottom:80px!important;}
.subsequent_contents_mtnarrow{margin-top:0px!important; margin-bottom:80px!important;}
@media only screen and (max-width: 1250px) {
.first_contents_mtnarrow{margin-top:60px!important; margin-bottom:60px!important;}
.subsequent_contents_mtnarrow{margin-bottom:60px!important;}}
@media only screen and (max-width: 1000px) {
.first_contents_mtnarrow{margin-top:50px!important; margin-bottom:50px!important;}
.subsequent_contents_mtnarrow{margin-bottom:50px!important;}}
@media only screen and (max-width: 900px) {
.first_contents_mtnarrow{margin-top:40px!important; margin-bottom:40px!important;}
.subsequent_contents_mtnarrow{margin-bottom:40px!important;}}
@media only screen and (max-width: 835px) {
.first_contents_mtnarrow{margin-top:30px!important; margin-bottom:30px!important;}
.subsequent_contents_mtnarrow{margin-bottom:30px!important;}}

/*firstだけTOP短めにしたい*/
.first_contents_mtshort{margin-top:50px!important;}
@media only screen and (max-width: 1250px) {
.first_contents_mtshort{margin-top:40px!important;}}
@media only screen and (max-width: 1000px) {
.first_contents_mtshort{margin-top:32px!important;}}
@media only screen and (max-width: 900px) {
.first_contents_mtshort{margin-top:24px!important;}}
@media only screen and (max-width: 835px) {
.first_contents_mtshort{margin-top:18px!important;}}

/* ============================================================
画像が左に来て右にテキスト
============================================================ */
.l_img_r_txt{
	width: 100%;
	box-sizing:border-box;
	overflow: hidden;
	padding: 0;
	margin: 0;
}
.l_img_r_txt > li,
.l_img_r_txt > div{
	width: 100%;
	display:flex;
	flex-direction:row;
	box-sizing:border-box;
	margin-top: 0px;
	margin-bottom: 40px;
	overflow: hidden;
}

.l_img_r_txt > li > p,
.l_img_r_txt > div > p{
	order: 0;
	width: 20%;
	margin-top: 0px;
	margin-bottom: 0px;
}
.l_img_r_txt > li > p img,
.l_img_r_txt > div > p img{
	border: 1px solid #cccccc;
	vertical-align:top;
} 
.l_img_r_txt > li > dl,
.l_img_r_txt > li > div,
.l_img_r_txt > div > div{
	order: 1;
	width: 80%;
	box-sizing: border-box;
	padding-left: 30px;
	margin: 0px;
	display: table;
}
.l_img_r_txt > li > dl dt,
.l_img_r_txt > div > div h3,
.l_img_r_txt > div > div h4{
	font-size: 1.4em;
	line-height: 1.2em;
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 15px;
}
.l_img_r_txt > li > dl dd,
.l_img_r_txt > li > div > p,
.l_img_r_txt > div > div > p{
	font-size: 1.2em;
	line-height: 2.0em;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.l_img_r_txt > li > dl > div,
.l_img_r_txt > li > div > p,
.l_img_r_txt > div > div,
.l_img_r_txt > div > p{
	display: table-cell;
}
@media only screen and (max-width: 1000px) {
.l_img_r_txt > li,
.l_img_r_txt > div{margin-bottom: 30px;}
.l_img_r_txt > li > dl,
.l_img_r_txt > li > div,
.l_img_r_txt > div > div{padding-left: 25px;}
.l_img_r_txt > li > dl dt,
.l_img_r_txt > div > div h3,
.l_img_r_txt > div > div h4{font-size: 1.3em;}
.l_img_r_txt > li > dl dd,
.l_img_r_txt > li > div > p{font-size: 1.1em; line-height: 1.8em;}}
@media only screen and (max-width: 900px) {
.l_img_r_txt > li > dl dt,
.l_img_r_txt > div > div h3,
.l_img_r_txt > div > div h4{font-size: 1.2em;}
.l_img_r_txt > li > dl dd,
.l_img_r_txt > li > div > p{font-size: 1.0em; line-height: 1.6em;}}
@media only screen and (max-width: 835px) {
.l_img_r_txt > li,
.l_img_r_txt > div{margin-top: 5px; margin-bottom: 20px;}
.l_img_r_txt > li > p{width: 30%;}
.l_img_r_txt > li > dl,
.l_img_r_txt > li > div,
.l_img_r_txt > div > div{width: 70%; padding-left: 20px;}
.l_img_r_txt > li > dl dt,
.l_img_r_txt > div > div h3,
.l_img_r_txt > div > div h4{margin-top: 8px; margin-bottom: 12px;font-size: 1.2em;line-height: 1.0em;}
.l_img_r_txt > li > dl dd,
.l_img_r_txt > li > div > p{font-size: 1.0em;line-height: 1.4em;}}
@media only screen and (max-width: 640px) {
.l_img_r_txt > li > dl dt,
.l_img_r_txt > div > div h3,
.l_img_r_txt > div > div h4{margin-top: 6px; margin-bottom: 8px;}}

/* 画像にボーダーなしにあてるスタイル */
.no_border > li > p img{border: none!important;}

/* テキスト縦位置中央揃え */
.l_img_r_txt > li > dl > div.vmiddle,
.l_img_r_txt > li > div > p.vmiddle{vertical-align: middle;}

/* 画像サイズ操作 */
.l_img25 > li > p,
.l_img25 > div > p{width: 25%;}
.l_img25 > li > dl, ul.l_img25 > li > div{width: 75%;}
.l_img20 > li > p,
.l_img20 > div > p{width: 20%;}
.l_img20 > li > dl, ul.l_img20 > li > div{width: 80%;}
.l_img15 > li > p,
.l_img15 > div > p{width: 15%;}
.l_img15 > li > dl, ul.l_img15 > li > div{width: 85%;}
.l_img10 > li > p,
.l_img10 > div > p{width: 10%;}
.l_img10 > li > dl, ul.l_img10 > li > div{width: 90%;}
.l_img5 > li > p,
.l_img5 > div > p{width: 5%;}
.l_img5 > li > dl, ul.l_img5 > li > div{width: 95%;}
@media only screen and (max-width: 835px) {
.l_img25 > li > p,
.l_img25 > div > p{width: 35%;}
.l_img25 > li > dl, ul.l_img25 > li > div{width: 65%;}
.l_img20 > li > p,
.l_img20 > div > p{width: 30%;}
.l_img20 > li > dl, ul.l_img20 > li > div{width: 70%;}
.l_img15 > li > p
.l_img15 > div > p{width: 25%;}
.l_img15 > li > dl, ul.l_img15 > li > div{width: 75%;}
.l_img10 > li > p,
.l_img10 > div > p{width: 20%;}
.l_img10 > li > dl, ul.l_img10 > li > div{width: 80%;}
.l_img5 > li > p,
.l_img5 > div > p{width: 15%;}
.l_img5 > li > dl, ul.l_img5 > li > div{width: 85%;}}

/* ============================================================
2カラムディスクリプション
============================================================ */
.description_2line{
	width: 100%;
	box-sizing:border-box;
	overflow: hidden;
}
.description_2line > div{
	width: 100%;
	box-sizing:border-box;
	overflow: hidden;
	margin: 0 auto 90px;
}
.description_2line > div:last-of-type{
	margin-bottom: 0px;
}
.description_2line > div > section{
	width: 46%!important;
	box-sizing:border-box;
	display: flex;
	flex-direction: column;
	float: left;
}
.description_2line > div > section:nth-of-type(2n+1){
	margin-right: 8%!important;
}
.description_2line > div > section h4,
.description_2line > div > section h5{
	font-size: 1.3em;
	line-height: 1.5em;
	margin: 0 0 20px 0;
	order: 1;
}
.description_2line > div > section > div{
	order: 2;	
}
.description_2line > div > section > div > p{
	font-size: 1.1em;
	line-height: 2em;
	margin: 0;
}
.description_2line > div > section > p{
	order: 0;
	margin: 0 0 25px 0;
}
.description_2line > div > section > p img{
	width: 100%;
	vertical-align: top;
}

/* 見出しの順番変え */
.description_2line_head1 > div > section h4,
.description_2line_head1 > div > section h5{
	order: 0;
}
.description_2line_head1 > div > section > p{
	order: 1;
}


@media only screen and (max-width: 1100px) {
.description_2line > div{margin-bottom:75px}
.description_2line > div > section,
.description_2line > div > p{width: 47%!important;}
.description_2line > div > section:nth-of-type(2n+1),
.description_2line > div > p:nth-of-type(2n+1){margin-right: 6%!important;}
.description_2line > div > section h4,
.description_2line > div > section h5,
.description_2line > div > section > p{margin-bottom: 16px!important;}}
@media only screen and (max-width: 950px) {
.description_2line > div{margin-bottom:60px}
.description_2line > div > section,
.description_2line > div > p{width: 48%!important;}
.description_2line > div > section:nth-of-type(2n+1),
.description_2line > div > p:nth-of-type(2n+1){margin-right: 4%!important;}
.description_2line > div > section h4,
.description_2line > div > section h5{font-size: 1.1em; margin-top:5px;margin-bottom: 13px!important;}
.description_2line > div > section > p{margin-bottom: 15px!important;}
.description_2line > div > section > div > p{font-size: 1.0em; line-height: 1.8em;}}
@media only screen and (max-width: 680px) {
.description_2line > div{margin-bottom:0px!important;}
.description_2line > div > section{width: 100%!important; float:none; margin-bottom:40px; }
.description_2line > div > section:nth-of-type(2n+1){margin-right: 0!important;}
.description_2line > div > section h4,
.description_2line > div > section h5,
.description_2line > div > section > p{margin-bottom: 5px!important;}
.description_2line > div > section > div > p{font-size: 0.9em; line-height: 1.6em;}}


/* 画像のみの場合 */
.description_2line > div > p{
	width: 48%!important;
	float: left;
}
.description_2line > div > p:nth-of-type(2n+1){
	margin-right: 4%!important;
}
.description_2line > div > p img{
	width: 100%;
	vertical-align: top;
}
@media only screen and (max-width: 680px) {
.description_2line > div > p{width: 100%!important; float:none; margin-bottom:20px; }
.description_2line > div > p:nth-of-type(2n+1){margin-right: 0!important;}}

/* 3列の場合 */
.description_2line > div{
	margin-bottom: 60px;
}
.description_3line > div > section{
	width: 30%!important;
}
.description_3line > div > section:nth-of-type(2n+1){
	margin-right: 0!important;
}
.description_3line > div > section:nth-of-type(3n+1),
.description_3line > div > section:nth-of-type(3n+2){
	margin-right: 5%!important;
}
@media only screen and (max-width: 1100px) {
.description_2line > div{margin-bottom: 45px;}}
@media only screen and (max-width: 950px) {
.description_2line > div{margin-bottom: 30px;}
.description_3line > div > section{	width: 32%!important;}
.description_3line > div > section:nth-of-type(3n+1),
.description_3line > div > section:nth-of-type(3n+2){margin-right: 2%!important;}}
@media only screen and (max-width: 680px) {
.description_3line > div{margin-bottom:0px!important;}
.description_3line > div > section{width: 100%!important;}
.description_3line > div > section:nth-of-type(3n+1),
.description_3line > div > section:nth-of-type(3n+2){margin-right: 0!important;}}

/* ============================================================
画像複数に対して説明が１つ
============================================================ */
.description_mimgs_1column{
	width: 100%;
	box-sizing:border-box;
	overflow: hidden;
	text-align: center;
}
.description_mimgs_1column > dl{
	width: 100%;
	overflow: hidden;
	margin: 0px;
}
.description_mimgs_1column > dl div{
	width: 48%;
	float: left;
	box-sizing:border-box;
	margin: 0px;
}
.description_mimgs_1column > dl div:first-child{margin-right: 4%;}

.description_mimgs_1column > dl div dt,
.description_mimgs_1column > dl div dd{
	font-weight: bold;
	font-size: 1.1em;
	line-height: 1.1em;
	margin:0 0 12px;
	text-align: center;
}
.description_mimgs_1column > dl div dd:last-of-type{
	font-weight: normal;
	margin-bottom: 25px;
}

.description_mimgs_1column > dl div dd img{
	width: 100%;
	vertical-align: top;
}

.description_mimgs_1column > div{
	display: inline-block;
	text-align: left;
}

/*3画像の時*/
.description_3imgs_1column > dl div{width: 30%;}
.description_3imgs_1column > dl div:first-child{margin-right: 5%;}
.description_3imgs_1column > dl div:last-child{margin-left: 5%;}

@media only screen and (max-width: 835px) {
.description_mimgs_1column > dl{margin-bottom: 0px;}
.description_mimgs_1column > dl div,
.description_3imgs_1column > dl div{width: 100%;}
.description_mimgs_1column > dl div:first-child,
.description_3imgs_1column > dl div:first-child{margin-right: 0;}
.description_3imgs_1column > dl div:last-child{margin-left: 0;}
.description_mimgs_1column > dl div dd{margin-bottom: 15px;}
.description_mimgs_1column > dl div:last-child dd,
.description_3imgs_1column > dl div:last-child dd{margin-bottom: 10px;}
.description_mimgs_1column > dl div dt{font-size: 1.0em;margin-bottom: 10px;}	
/*スマホサイズで並列に並べるとき*/
.description_parallel > dl div{width: 49%;}
.description_parallel > dl div:first-child{margin-right: 2%;}
/*スマホサイズで並列に並べるとき（3画像）*/
.description_parallel_3imgs > dl div{width: 32%;}
.description_parallel_3imgs > dl div:first-child{margin-right: 2%;}
.description_parallel_3imgs > dl div:last-child{margin-left: 2%;}
}

/* ============================================================
幅によってズレていくフロートコンテンツ
============================================================ */
.float_contents{
	width: 100%;
	box-sizing:border-box;
	overflow: hidden;
	height: auto;
}
.float_contents > div,
.float_contents > section{
	margin-bottom: 30px;
	box-sizing:border-box;
	padding: 25px;
	display: flex;
	flex-direction: column;
	float: left;
	overflow: hidden;
}
.float_contents > div h4,
.float_contents > section h4,
.float_contents > div h5,
.float_contents > section h5{
	font-size: 1.3em;
	line-height: 1.5em;
	margin: 5px 0 20px 0;
	order: 1;
}
.float_contents > div > div,
.float_contents > section > div{
	order: 2;
	margin: 0;
}
.float_contents > div > p,
.float_contents > section > p{
	order: 0;
	margin: 0 0 15px;
}
.float_contents > div > div p,
.float_contents > section > div p{
	font-size: 1.1em;
	line-height: 2em;
	margin: 0;
}

/*スタートが4*/
.float_contents_4 > div,
.float_contents_4 > section{
	width: 23%;
	margin-right: 2.6%;
}
.float_contents_4 > div:nth-of-type(4n+4),
.float_contents_4 > section:nth-of-type(4n+4){
	margin-right: 0;
}
/*スタートが3*/
.float_contents_3 > div,
.float_contents_3 > section{
	width: 32%;
	margin-right: 2%;
}
.float_contents_3 > div:nth-of-type(3n+3),
.float_contents_3 > section:nth-of-type(3n+3){
	margin-right: 0;
}

/*スタートが5*/
.float_contents_5 > div,
.float_contents_5 > section{
	width: 18%;
	margin-right: 2.5%;
}
.float_contents_5 > div:nth-of-type(5n+5),
.float_contents_5 > section:nth-of-type(5n+5){
	margin-right: 0;
}

@media only screen and (max-width: 1200px) {
.float_contents > div h4,
.float_contents > section h4,
.float_contents > div h5,
.float_contents > section h5{font-size: 1.2em;}
}
@media only screen and (max-width: 1000px) {
.float_contents > div h4,
.float_contents > section h4,
.float_contents > div h5,
.float_contents > section h5{font-size: 1.1em;}
.float_contents > div > div p,
.float_contents > section > div p{font-size: 1.0em;line-height: 1.8em;}
.float_contents_4 > div,.float_contents_4 > section{width: 32%;	margin-right: 2%;}
.float_contents_4 > div:nth-of-type(4n+4),
.float_contents_4 > section:nth-of-type(4n+4){margin-right: 2%;}
.float_contents_4 > div:nth-of-type(3n+3),
.float_contents_4 > section:nth-of-type(3n+3){margin-right: 0;}	
.float_contents_5 > div,.float_contents_5 > section{width: 23%;	margin-right: 2.6%;}
.float_contents_5 > div:nth-of-type(5n+5),
.float_contents_5 > section:nth-of-type(5n+5){margin-right: 2.6%;}
.float_contents_5 > div:nth-of-type(4n+4),
.float_contents_5 > section:nth-of-type(4n+4){margin-right: 0;}
	
}
@media only screen and (max-width: 835px) {
.float_contents > div,
.float_contents > section{padding: 15px;}
.float_contents_3 > div,.float_contents_3 > section{width: 48%;	margin-right: 4%;}
.float_contents_3 > div:nth-of-type(3n+3),
.float_contents_3 > section:nth-of-type(3n+3){margin-right: 4%;}
.float_contents_3 > div:nth-of-type(2n+2),
.float_contents_3 > section:nth-of-type(2n+2){margin-right: 0;}	
.float_contents_5 > div,.float_contents_5 > section{width: 32%;	margin-right: 2%;}
.float_contents_5 > div:nth-of-type(5n+5),
.float_contents_5 > section:nth-of-type(5n+5),
.float_contents_5 > div:nth-of-type(4n+4),
.float_contents_5 > section:nth-of-type(4n+4){margin-right: 2%;}
.float_contents_5 > div:nth-of-type(3n+3),
.float_contents_5 > section:nth-of-type(3n+3){margin-right: 0;}
}
@media only screen and (max-width: 680px) {
.float_contents > div h4,
.float_contents > section h4,
.float_contents > div h5,
.float_contents > section h5{font-size: 1.0em;}
.float_contents > div > div p,
.float_contents > section > div p{font-size: 0.9em;line-height: 1.6em;}
.float_contents_4 > div,.float_contents_4 > section{width: 48%;	margin-right: 4%;}
.float_contents_4 > div:nth-of-type(3n+3),
.float_contents_4 > section:nth-of-type(3n+3){margin-right: 4%;}
.float_contents_4 > div:nth-of-type(2n+2),
.float_contents_4 > section:nth-of-type(2n+2){margin-right: 0;}
.float_contents_5 > div,.float_contents_5 > section{width: 48%;	margin-right: 4%;}
.float_contents_5 > div:nth-of-type(3n+3),
.float_contents_5 > section:nth-of-type(3n+3){margin-right: 4%;}
.float_contents_5 > div:nth-of-type(2n+2),
.float_contents_5 > section:nth-of-type(2n+2){margin-right: 0;}
}
	
/*背景ベタグレー*/
.float_contents_bg_gray > div,
.float_contents_bg_gray > section{
	background-color: #f3f3f3;
}
/*グレー点線枠*/
.float_contents_grayline > div,
.float_contents_grayline > section{
	border: 2px dotted #666666;
}

/*テキストナシ*/
.float_contents_notext > div h4,
.float_contents_notext > section h4,
.float_contents_notext > div h5,
.float_contents_notext > section h5{height: 2em;}

/*高さ360*/
.float_contents_h360_w835_h300 > div,
.float_contents_h360_w835_h300 > section{
	height: 360px;
}

@media only screen and (max-width: 835px) {
.float_contents_h360_w835_h300 > div,.float_contents_h360_w835_h300 > section{height: 300px;}
}
/* ============================================================
画像と説明が並列で説明側が縦関係中央
============================================================ */

/*左テキスト右画像*/
.parallel_txt_img{
	display: table;	
	overflow: hidden;
	margin-bottom: 50px;
}
.parallel_txt_img > div{
	display: table-cell;
	vertical-align: middle;
}
.parallel_txt_img > div > div{
	box-sizing: border-box;
	width: 95%;
	margin-right: 5%;
}
.parallel_txt_img > p{
	display: table-cell;	
}

/*左画像右テキスト*/
.parallel_img_txt{
	display: flex;
	margin-bottom: 50px;	
}
.parallel_img_txt > div{
	order: 1;
	display: table;
}
.parallel_img_txt > div > div{
	display: table-cell;
	vertical-align: middle;
	box-sizing: border-box;
	width: 95%;
	padding-left: 5%;
}
.parallel_img_txt > p{
	order: 0;
}
.para_img20 > div{width: 80%;}
.para_img20 > p{width: 20%;}
.para_img30 > div{width: 70%;}
.para_img30 > p{width: 30%;}
.para_img40 > div{width: 60%;}
.para_img40 > p{width: 40%;}
.para_img50 > div{width: 50%;}
.para_img50 > p{width: 50%;}
.para_img60 > div{width: 40%;}
.para_img60 > p{width: 60%;}
.para_img70 > div{width: 30%;}
.para_img70 > p{width: 70%;}
.para_img80 > div{width: 20%;}
.para_img80 > p{width: 80%;}

@media only screen and (max-width: 835px) {
.parallel_txt_img{display: flex;flex-direction: column;margin-bottom: 0px;}
.parallel_txt_img > div{display: block; order: 1; width: 100%; margin-bottom: 20px;}
.parallel_txt_img > div > div{display: block; width: 100%; padding-right: 0;}
.parallel_txt_img > p{display: block; order: 0; width: 100%;}
.parallel_txt_img h4 {margin-top: 0;margin-bottom: 0;}
	
.parallel_img_txt{flex-direction: column;margin-bottom: 0px;}
.parallel_img_txt > div{display: block; width: 100%; margin-bottom: 20px;}
.parallel_img_txt > div > div{display: block; width: 100%; padding-left: 0;}
.parallel_img_txt > p{width: 100%;}
.parallel_img_txt h4 {margin-top: 0;margin-bottom: 0;}
	
.para_img20 > div,.para_img20 > p,.para_img30 > div,.para_img30 > p,.para_img40 > div,.para_img40 > p,.para_img50 > div,.para_img50 > p,.para_img60 > div,.para_img60 > p,.para_img70 > div,.para_img70 > p,.para_img80 > div,.para_img80 > p{width: 100%;}
}


/* ============================================================
リード文
============================================================ */
.lead_text{
	width: 100%;
	padding: 0px;
	box-sizing: border-box;
	overflow: hidden;
}
.lead_text > h3,.lead_text > h2{
	font-size: 1.8em;
	line-height: 1.7em;
	color: #444444;
	margin-top: 0;
	margin-bottom: 28px;
	text-align: center;
}
.lead_text > h4{
	font-size: 1.5em;
	line-height: 1.2em;
	color: #444444;
	margin-top: 0;
	margin-bottom: 25px;
	text-align: center;
}
.lead_text > p,
.lead_text > div > p{
	font-size: 1.4em;
	color: #333333;
	line-height: 2em;
	margin-top: 0;
	margin-bottom: 35px;
	text-align: center;
}
.lead_text > p img,
.lead_text > div > p img{
	width: 100%;
	vertical-align: bottom;
}
.lead_text > p:last-child{
	margin-bottom: 0px!important;
}
@media only screen and (max-width: 1250px) {
.lead_text > h3,.lead_text > h2{font-size: 1.6em; margin-bottom: 22px;}
.lead_text > h4{font-size: 1.3em; margin-bottom: 20px;}
.lead_text > p,
.lead_text > div > p{font-size: 1.3em; line-height: 1.8em;	margin-bottom: 25px;}}
@media only screen and (max-width: 1000px) {
.lead_text > h3,.lead_text > h2{font-size: 1.4em; margin-bottom: 18px;}
.lead_text > h4{font-size: 1.2em; margin-bottom: 16px;}
.lead_text > p,
.lead_text > div > p{font-size: 1.2em; line-height: 1.6em; margin-bottom: 20px;}}
@media only screen and (max-width: 900px) {
.lead_text > h3,.lead_text > h2{font-size: 1.3em; margin-bottom: 13px;}
.lead_text > h4{font-size: 1.1em; margin-bottom: 12px;}
.lead_text > p,
.lead_text > div > p{font-size: 1.0em; line-height: 1.4em; margin-bottom: 15px;}}
@media only screen and (max-width: 835px) {
.lead_text > h3,.lead_text > h2{margin-bottom: 10px;}
.lead_text > h4{font-size: 1.0em; margin-bottom: 8px;}
.lead_text > p,
.lead_text > div > p{margin-bottom: 12px;}}

/* すべて中央揃えのリード文（携帯サイズで左揃え） */
@media only screen and (max-width: 835px) {
.lead_center_mleft > h2,
.lead_center_mleft > h3,
.lead_center_mleft > h4{text-align: left;}
.lead_center_mleft > p,
.lead_center_mleft > div > p{text-align: left;}}

/*すべて中央揃えのリード文（携帯サイズでテキストだけ左揃え）*/
@media only screen and (max-width: 835px) {
.lead_center_mcenter_mleft > p,
.lead_center_mcenter_mleft > div > p{text-align: left;}}

/* タイトル(中央揃え)と補足説明(左寄せ) */
.lead_center_txtleft > p,
.lead_center_txtleft > div > p{text-align: left;}

/* タイトル(中央揃え)と補足説明(左寄せ)（携帯サイズで全部左揃え） */
.lead_center_txtleft_mleft > p,
.lead_center_txtleft_mleft > div > p{text-align: left;}
@media only screen and (max-width: 835px) {
.lead_center_txtleft_mleft > h2,
.lead_center_txtleft_mleft > h3,
.lead_center_txtleft_mleft > h4{text-align: left;}}

/* 画像での説明が行われる場合 */
.lead_img_description > p,
.lead_img_description > div > p{
	font-size: 1.2em;
	line-height: 1.8em;
	margin-bottom: 25px;
}
@media only screen and (max-width: 1250px) {
.lead_img_description > p, .lead_img_description > div > p{margin-bottom: 20px;}}
@media only screen and (max-width: 1000px) {
.lead_img_description > p, .lead_img_description > div > p{font-size: 1.1em; line-height: 1.8em; margin-bottom: 15px;}}
@media only screen and (max-width: 900px) {
.lead_img_description > p, .lead_img_description > div > p{font-size: 1.0em; line-height: 1.6em; margin-bottom: 10px;}}
@media only screen and (max-width: 835px) {
.lead_img_description > p, .lead_img_description > div > p{margin-bottom: 6px;}}

/* 見出しより画像が先に来る場合 */
.lead_img_first{
	display: flex;
	flex-direction: column;
}
.lead_img_first > h4{order: 1;}
.lead_img_first > p{order: 2;}
.lead_img_first > p:first-of-type{order: 0;}


/* ============================================================
下に短いアンダーラインが出る大見出し（会社概要などで使われる見出しデザイン）h1想定
============================================================ */

h1.usual_headline{
	text-align: center;
	font-weight: bold;
	font-size: 1.7em;
	line-height: 1.5em;
	/*white-space: nowrap;*/
	margin: 0px auto 0;
	overflow: hidden;
}
h1.usual_headline::after{
	content: "　";
	display: block;
	width: 20px;
	margin: -1em auto 60px;	
	border-bottom: 4px solid #f4a100;	
}

@media only screen and (max-width: 835px) {
	h1.usual_headline{font-size: 1.5em;}
	h1.usual_headline::after{margin-bottom: 30px;}
}

/* ============================================================
下に短い点線が出る大見出し h1以外想定
============================================================ */

.usual_orangeheadlineshort{
	text-align: center;
	font-weight: bold;
	line-height: 1.5em;
	/*white-space: nowrap;*/
	margin: 0px auto 0;
	overflow: hidden;
}
.usual_orangeheadlineshort::after{
	content: "　";
	display: block;
	width: 50px;
	margin: -1em auto 0px;	
	border-bottom: 10px dotted #f4a100;	
}

@media only screen and (max-width: 835px) {
	.usual_orangeheadlineshort::after{margin-bottom: 5px;}
}


/* ============================================================
下にオレンジ点線のアンダーラインが出る見出し（会社概要などで使われる見出しデザイン）h2想定
============================================================ */

.usual_orangeheadline{
	font-weight: bold;
	padding: 0 0 12px 1px;
	margin-bottom: 20px;
	border-bottom: 2px dotted #f4a100;
}
@media only screen and (max-width: 835px) {
	.usual_orangeheadline{font-size: 1.2em;padding-bottom:8px;margin-bottom:13px;}
}

/* ============================================================
上下にグレーのラインが出る見出し h3想定
============================================================ */

.usual_grayoverunderline{
	font-size: 1.2em;
	font-weight: bold;
	padding: 8px 0 8px 1px;
	margin-bottom: 13px;
	border-top: 1px solid #666666;
	border-bottom: 1px solid #666666;
}
@media only screen and (max-width: 835px) {
	.usual_grayoverunderline{font-size: 1.2em;padding-bottom:6px;margin-bottom:11px;}
}

/* ============================================================
下にグレーのアンダーラインが出る見出し（会社概要などで使われる見出しデザイン）h3想定
============================================================ */

.usual_grayunderline{
	font-size: 1.2em;
	font-weight: bold;
	padding: 0 0 8px 1px;
	margin-bottom: 13px;
	border-bottom: 1px solid #dddddd;
}
/*
.usual_grayunderline:before {
  content: "●";
  position: absolute;
  font-size: 1.4em;
  left: 0;
  top: -0.2em;
}*/

@media only screen and (max-width: 835px) {
	.usual_grayunderline{font-size: 1.2em;padding-bottom:6px;margin-bottom:11px;}
}
/* ============================================================
グレーのライン囲みが出る見出し（会社概要などで使われる見出しデザイン）h3想定
============================================================ */

.usual_graywrapline{
  position: relative;
	font-weight: bold;
	font-size: 1.2em;
	padding: 7px 0 8px 2em;
	margin-bottom: 13px;
	color: #555555;
	border: 1px solid #dddddd;
}

.usual_graywrapline:before {
  content: "●";
  position: absolute;
  font-size: 0.8em;
  left: 0.9em;
  top: 0.8em;
	color: #cccccc;
}

@media only screen and (max-width: 835px) {
	.usual_graywrapline{font-size: 1.2em;padding-bottom:6px;margin-bottom:11px;}
	.usual_graywrapline:before {top: 0.7em;}
}

/* ============================================================
スマホ時にグレーのアンダーラインが出る見出し
============================================================ */

@media only screen and (max-width: 835px) {
	.w835_grayunderline{padding-bottom:8px; margin-bottom: 14px; border-bottom: 1px solid #dddddd;}
}

/* ============================================================
オレンジの■が出る見出し h3想定
============================================================ */
.usual_orange_square{
	font-weight: bold;
	font-size: 1.0em;
	padding: 0px 0 0px 0px;
	margin: 0px 0 8px 0px;
}

.usual_orange_square::before{
	content: "■";
	color: #f4a100;
	font-size: 1.1em;
	padding-right: 4px;
}
/* ============================================================
グレーの●が出る見出し h4想定
============================================================ */
.usual_gray_square{
	font-size: 1.0em;
	font-weight: bold;
	padding: 0px 0 0px 0px;
	margin: 0em 0 8px 0px;
	color: #444444;
	display: inline-block;
	position: relative;
	left: 1.2em;
	/*border-bottom: 3px solid antiquewhite;*/
}
.usual_gray_square::before{
	content: "●";
	color: #cccccc;
	font-size: 0.7em;
	display: inline-block;
	position: absolute;
	top:0.6em;
	left: -1.5em;
}

/* ============================================================
斜め切りシンボル見出し 短めの文章限定
============================================================ */
.usual_diagonal_symbol {
  position: relative;
  overflow: hidden;
  padding: 1.5rem 2rem 1.5rem 130px;
  height: 3.5em;
	font-size: 1.1em;
  border: 2px solid #333333;
	margin-bottom: 13px;
}

.usual_diagonal_symbol:before {
  position: absolute;
  top: -154%;
  left: -120px;
  width: 200px;
  height: 300%;
  content: '';
  -webkit-transform: rotate(25deg);
  transform: rotate(25deg);
  background: #333333;
}

.usual_diagonal_symbol > span {
	font-size: 1.7em;
  position: absolute;
  z-index: 1;
  top: -5px;
  left: 0;
  display: block;
  padding: 0px 0px 0 18px;
  color: #ffffff;
}
.usual_diagonal_symbol > span > span {
	font-size:0.8em;
  color: #333333;
	display: inline-block;
  padding: 0px 0px 0px 45px;
}
/* ============================================================
両サイドにライン見出し
============================================================ */
.usual_bothsides_line {
  position: relative;
  padding: 0 65px;
  text-align: center;
  color: #666666!important;
	margin-bottom: 13px;
}

.usual_bothsides_line:before {
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  width: 100%;
  height: 2px;
  content: '';
  background: #666666!important;
}

.usual_bothsides_line > span {
  position: relative;
  padding: 0 1em;
  background: #fff;
}

@media only screen and (max-width: 835px) {
	.usual_bothsides_line{position: static; padding: 0 10px 10px; border-bottom: 2px solid #666666!important;line-height: 1.3em;}
	.usual_bothsides_line:before{content: none;position: static;}
	.usual_bothsides_line > span{background: none;padding: 0 0;}
}
/* ============================================================
バックに斜めグレーストライプ見出し
============================================================ */
.usual_diagonal_buck_gray {
    padding: .3em .6em;
	font-size: 1.4em;
    background-image: repeating-linear-gradient(-45deg, #f2f2f2, #f2f2f2 3px, #e9e9e9 3px, #e9e9e9 7px);
  color: #444444;
	text-align: center;
	border-bottom: 3px solid #f4a100; 
	margin-bottom: 13px;
}

@media only screen and (max-width: 835px) {
	.usual_diagonal_buck_gray{font-size: 1.2em;}
}

/* ============================================================
赤の点線枠囲み 注意文想定
============================================================ */
.usual_red_wrap_dot{
	padding: 0.5em 1.5em;
	margin: 0em 0 8px 0px;
	color: #cc0000;
	width: 100%;
	box-sizing: border-box;
	border: 2px dotted #cc0000;
	font-weight: bold;
}

/* ============================================================
グレーの背景で囲む 特記事項想定
============================================================ */
.usual_gray_bg_wrap{
	padding: 0.5em 1.5em;
	margin: 0em 0 10px 0px;
	background-color: #f3f3f3;
	width: 100%;
	box-sizing: border-box;
}

/* ============================================================
グレーの点線で囲む 特記事項想定
============================================================ */
.usual_gray_wrap_dot{
	padding: 0.5em 1.5em;
	margin: 0em 0 10px 0px;
	width: 100%;
	box-sizing: border-box;
	border: 1px dotted #aaaaaa;
}
/* ============================================================
BOX並びでボタンが入るデザイン(2カラム)
============================================================ */
.flex_wrap{
	display:flex;	
	align-items: stretch;
	justify-content: space-between;
}
.flex_wrap > section,
.flex_wrap > div{
	width: 49%;
	border: 1px solid #aaaaaa;
	box-sizing: border-box;
	padding: 1.2em;
	position: relative;
	display:flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-direction: column;
}
.flex_wrap > section:first-of-type,
.flex_wrap > div:first-of-type{
	margin-right: 2%;
}

.flex_wrap > section a,
.flex_wrap > div a{
	width: 100%;
	margin: auto auto 0 auto;
}
.flex_wrap > section > div,
.flex_wrap > div > div{
	padding: 0 3px 10px;
}

@media only screen and (max-width: 900px) {
.flex_wrap{	display: block;}
.flex_wrap > section, .flex_wrap > div{float:none; width: 100%;}
.flex_wrap > section:first-of-type, .flex_wrap > div:first-of-type{margin-right: 0%; margin-bottom: 25px;}
}

/* ============================================================
PCでは横だがスマホサイズで縦になる図（比率については個別設定）
============================================================ */
.illustrated_variable{
	background-color: #e6e6e6;
	width: 100%;
	display: table;
	margin-top: 0;
	margin-bottom: 35px;
}
.illustrated_variable p{
	display: table-cell;
	margin: 0;
	text-align: center;
	vertical-align: middle;
}
.illustrated_variable img{
	vertical-align:middle;
}
@media only screen and (max-width: 1250px) {
.illustrated_variable{margin-bottom: 25px;}}
@media only screen and (max-width: 1000px) {
.illustrated_variable{margin-bottom: 20px;}}
@media only screen and (max-width: 900px) {
.illustrated_variable{margin-bottom: 15px;}}
@media only screen and (max-width: 835px) {
.illustrated_variable{display: block; margin-bottom: 8px;}
.illustrated_variable p{display: block;}}

/* ============================================================
比較表テーブル
============================================================ */

.comparison_table{
	border: 1px solid #555555;
	font-size: 1.2em;
	color: #555555;
	text-align: center;
	width: 100%;
}
.comparison_table th,
.comparison_table td{
	padding-left: 15px;
	padding-right: 15px;
}
.comparison_table th{
	font-size: 1.3em;
	padding-top: 20px;
	color: #333333;
}
.comparison_table tr:first-child th{
	border: 1px solid #555555;
	padding: 5px 0!important;
	font-weight: bold;
	/*background-color: #e0e000;*/
	background-color: #555555;
	color: #ffffff;
}
.comparison_table tr:first-child th:first-child{
	border-right:1px solid #ffffff;
}

.comparison_table tr td:first-child,
.comparison_table tr th:first-child{
	border-right:1px solid #666666;
	
}
.comparison_table td img{
	width:100%;
	padding-top: 15px;
	padding-bottom: 15px;
}

@media only screen and (max-width: 835px) {
.comparison_table{font-size: 1.0em;}
.comparison_table th{font-size: 1.1em;}
}

/* ============================================================
ダウンロード用表組
============================================================ */

dl.download_table{
	margin:0px 0 50px;
}
dl.download_table > div{
	border: 1px solid #cccccc;
	width: 100%;
	display: table;
	margin-bottom: 20px;
}
dl.download_table > div dt{
	display: table-cell;
	padding: 8px 12px;
	width: 30%;
	border-right: 1px solid #cccccc;
	background-color: #666666;
	color: #ffffff;
	vertical-align: middle;
}
dl.download_table > div dd{
	display: table-cell;
	padding: 8px 12px;
	width: 70%;
	vertical-align: middle;
}
@media only screen and (max-width: 835px) {
dl.download_table > div{margin-bottom: 10px;}
}

/* ============================================================
塗りつぶしの見出し
============================================================ */
.fill_hl{
	width:100%;
	border: 1px solid #333333;
	box-sizing: border-box;
	overflow: hidden;
	padding: 40px;
}

.fill_hl dl{
	width:100%;
	box-sizing: border-box;
	overflow: hidden;
}

.fill_hl dl dt{
	width:100%;
	color: #ffffff;
	background-color: #333333;
	font-size: 1.4em;
	font-weight: bold;
	text-align: center;
	padding: 3px 0;
	margin: 0 0 15px;
}

.fill_hl dl dd{
	width:100%;
	font-size: 1.2em;
	margin: 0 0 50px;
}
.fill_hl dl dd:last-child{
	margin-bottom: 0;
}
/*文字塗りつぶしが白*/

.fill_hl_white{
	border: 1px solid #ffffff!important;
}
.fill_hl_white dl dt{
	color: #333333!important;
	background-color: #ffffff!important;
}
.fill_hl_white dl dd{
	color: #ffffff!important;
}

@media only screen and (max-width: 900px) {
.fill_hl dl dt{font-size: 1.3em;}
.fill_hl dl dd{font-size: 1.0em; line-height: 1.8em; margin-bottom: 30px;}}
@media only screen and (max-width: 835px) {
.fill_hl dl dt{font-size: 1.1em; margin-bottom: 8px;}
.fill_hl dl dd{margin-bottom: 20px;}}

s/*================================================
   外枠をここで操作(UAGやプリンストン製品、ULTRAPLUSは除く)
================================================*/
.product_wrap{
	width: 1400px;
	padding: 0 50px;
	margin: 70px auto;
	box-sizing: border-box;
}

@media only screen and (max-width: 1400px) {
	.product_wrap{width: 100%; padding: 0 40px;}
}
@media only screen and (max-width: 1160px) {
	.product_wrap{padding: 0 30px;}
}
@media only screen and (max-width: 835px) {
	.product_wrap{margin:40px 0;}
}

/*================================================
   ニュース用表組
================================================*/
.terms_contents h3{
	background-color: #555555;
	text-align: center;
	color: #ffffff;
	font-size: 1.2em;
	padding: 6px 0!important;
	margin-bottom: 15px!important;
	overflow: hidden;
}
.terms_contents h3::before{
	content: none!important;
}
.terms_contents dl{
	overflow: hidden;
	margin: 0;
}
.terms_contents dl div{
	display: table;
	background: #f6f6f6;
	padding: 20px 25px;
	width: 100%;
	margin-bottom: 15px;
}
.terms_contents dl div:last-child{
	margin-bottom: 0px;
}
.terms_contents dl div dt,
.terms_contents dl div dd{
	display: table-cell;
	vertical-align: middle;
}
.terms_contents dl div dt{
	border-right:2px dotted #888888;
	width: 18%;
	font-weight: bold;
	padding-right: 15px;
}
.terms_contents dl div dd{
	padding-left: 15px;
}
/*================================================
   ニュース用表組2
================================================*/
.venue_table{
	width: 100%;
	border-collapse: separate;
	border-spacing:10px;
	overflow: hidden;
	margin-bottom: 10px;
}
.venue_table th,
.venue_table td{
	padding:0px 5px;	
}
.venue_left{
	text-align: center;
	vertical-align: middle;
	border: 1px solid #bbbbbb;
}

.venue_theme{
	text-align: center;
	background-color: #eeeeee;
}

dl.n_terms{
	background-color: #f6f6f6;
	padding: 20px 30px;
	box-sizing: border-box;
	margin-bottom: 70px;
}
dl.n_terms dt{
	font-weight: bold;
	font-size: 1.2em;
}
dl.n_terms dd{
	font-size: 1.1em;
}
dl.n_terms dd ol li span,
dl.n_terms dd ol li a{
	font-weight: bold;
}
dl.n_terms dd ol li a:link,
dl.n_terms dd ol li a:visited,
dl.n_terms dd ol li a:hover{
	color: #333333;
}
dl.n_terms dd ol li a:link,
dl.n_terms dd ol li a:visited{
	text-decoration: underline;
}
dl.n_terms dd ol li a:hover{
	text-decoration: none;
}

/*================================================
   ニュース用表組3
================================================*/
.terms_contents2 dl{
	overflow: hidden;
	margin: 0;
	width: 100%;
}
.terms_contents2 dl > div{
	display: table;
	width: 100%;
}
.terms_contents2 dl > div > dt{
	font-weight: bold;
	border: 1px solid #bbbbbb;
	padding: 5px;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
.terms_contents2 dl > div > dd{
	display: table-cell;
	padding-left: 15px;
}
.terms_contents2 dl > div > dd > dl{
	overflow: hidden;
	margin: 0;
}
.terms_contents2 dl > div > dd > dl > div{
	display: table;
	background: #f6f6f6;
	padding: 20px 25px;
	width: 100%;
	margin-bottom: 15px;
}
.terms_contents2 dl > div > dd > dl > div:last-child{
	margin-bottom: 0px;
}
.terms_contents2 dl > div > dd > dl > div dt,
.terms_contents2 dl > div > dd > dl > div dd{
	display: table-cell;
	vertical-align: middle;
}
.terms_contents2 dl > div > dd > dl > div dt{
	border-top: none;
	border-bottom: none;
	border-left: none;
	border-right:2px dotted #888888;
	width: 25%;
	font-weight: bold;
	padding: 0 15px 0 0;
}
.terms_contents2 dl > div > dd > dl > div dd{
	padding-left: 15px;
}
@media only screen and (max-width: 1050px) {
.terms_contents2 dl > div > dd > dl > div dt{width: 32%;}
}
@media only screen and (max-width: 835px) {
.terms_contents2 dl > div,
.terms_contents2 dl > div > dt,
.terms_contents2 dl > div > dd{display: block;}
.terms_contents2 dl > div > dt{margin: 0 0 15px;}
.terms_contents2 dl > div > dd{margin: 0;padding-left: 0px;}
.terms_contents2 dl > div > dd > dl > div dt{width: 36%;}
}

/*================================================
   ニュース用URL表
================================================*/
.news_url_list{
	width: 100%;
	padding: 25px 35px;
	/*background-color: #fbeed4;*/
}

.news_url_list h3{
	margin-top: 0!important;
}

.news .news_url_list  h3{
	font-size: 1.1em;
	padding: 5px 8px 5px 8px;
	margin: 0px 0 30px 0px;
	background-color: #ffffff;
	text-align: center;
}

.news .news_url_list  h3::before{
	content: "";
	font-size: 1.1em;
	padding-right: 0px;
}

/*================================================
   各種ボタン
================================================*/

/*基本*/
a.button_basic, .button_grayout span {
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    /*max-width: 280px;*/
  padding: 0.8em 1em 0.9em 0em;
  font-size: 1em;
    transition: 0.3s ease-in-out;
    font-weight: 700;
	text-decoration: none;
}
a.button_basic:after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 2rem;
  font-size: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 10px;
  height: 10px;
  border-top: solid 2px currentColor;
  border-right: solid 2px currentColor;
  transform: translateY(-50%) rotate(45deg);
}
a.button_basic:hover:after {
  right: 1.4rem;
}
@media only screen and (max-width: 835px) {	
a.button_basic:after {width: 6px!important; height: 6px!important;}
}

/*オレンジベタのボタン*/
a.orange_button { color: #ffffff; background-color: #f4a100;}
a.orange_button::after { border-top-color: #ffffff; border-right-color: #ffffff;}
a.orange_button:hover { background-color: #facd77;}

/*黒枠のボタン*/
a.black_frame_button { color: #333333; background-color: #ffffff; border: 1px solid #333333;}
a.black_frame_button::after { border-top-color: #333333; border-right-color: #333333;}
a.black_frame_button:hover { color: #ffffff; background-color: #333333;}
a.black_frame_button:hover:after { border-top-color: #ffffff; border-right-color: #ffffff;}

/*オレンジ枠のボタン*/
a.orange_frame_button { color: #333333; background-color: #ffffff; border: 1px solid #f4a100;}
a.orange_frame_button::after { border-top-color: #f4a100; border-right-color: #f4a100;}
a.orange_frame_button:hover { color: #ffffff; background-color: #f4a100;}
a.orange_frame_button:hover:after { border-top-color: #ffffff; border-right-color: #ffffff;}

/*幅*/
a.button_width15em_w835_100{width: 15em;}
a.button_width17em_w835_100{width: 17em;}
a.button_width18em_w835_100{width: 18em;}
a.button_width20em_w835_100{width: 20em;}
a.button_width25em_w835_100{width: 25em;}
a.button_width30em_w835_100{width: 30em;}
a.button_width40em_w835_100{width: 40em;}
a.button_width100p{width: 100%;}
@media only screen and (max-width: 835px) {	a.button_width15em_w835_100,a.button_width20em_w835_100,a.button_width25em_w835_100,a.button_width30em_w835_100,a.button_width40em_w835_100{width:100%;}
a.button_basic:after {width: 10px; height: 10px;}
}

/*グレーアウト aタグの1つ親のタグに充てる*/

.button_grayout span{
	background-color: #cccccc;
	color: #ffffff;	
}


/*================================================
   各種ボタン 文字が中央
================================================*/

/*基本*/



/*================================================
   動画掲載
================================================*/
.movie_wrap{
	width: 100%; 
	text-align: center;
	margin: 0 0 35px 0;
}

@media screen and (max-width: 768px){
.movie_wrap{margin-bottom: 15px;}
.movie_wrap iframe{width: 100%!important; height: auto!important;}
}

.movie_wrap_portrait{
	width: 23%;
	margin: 20px auto 35px;	
}

.movie_wrap_portrait video{
	width: 100%;	
}
@media screen and (max-width: 1300px){.movie_wrap_portrait{width: 28%;}}
@media screen and (max-width: 1100px){.movie_wrap_portrait{width: 35%;}}
@media screen and (max-width: 950px){.movie_wrap_portrait{width: 42%;}}

@media screen and (max-width: 835px){
.movie_wrap_portrait{width: 75%; margin-top: 20px; margin-bottom: 15px;}
}
/*動画下に注意書き入れる場合 class="kome"の親要素にdiv追加*/
.movie_kome{
	width: 704px;
	margin: -10px auto 0;
}
@media screen and (max-width: 768px){
.movie_kome{width: 100%; margin-top: -5px;}
}