@charset "utf-8";

/* ============================================================
製品ページメインビジュアル 右に画像左にロゴやテキスト（UAGやJAYSなど）
============================================================ */
.page-product-hero > div.l_logotext_r_mainvisual{
	width: 100%;
	overflow: hidden;
}
.page-product-hero > div.l_logotext_r_mainvisual > section{
	box-sizing: border-box;	
	padding: 0px;
	width: 100%;
	overflow: hidden;
	display: table;	
}
.page-product-hero > div.l_logotext_r_mainvisual > section > div{
	display: table-cell;
	overflow: hidden;
	float: right;
	width: 720px;
	text-align: left;
	height: 650px;
	position: relative;
}
.page-product-hero > div.l_logotext_r_mainvisual > section:after{
	content: "";
	display: table-cell;
	width: 50%;
	overflow: hidden;
	background-size: 130%; 
	background-position: 20% 50%;
	background-repeat: no-repeat;
}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2{
	margin-top: 30px;
	margin-bottom: 0px!important;
}

.page-product-hero > div.l_logotext_r_mainvisual section > div p{
	text-align: left;
	overflow: hidden;
}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_compatible {
	margin-top: 13px!important;
	margin-bottom: 0px!important;
	font-size: 18px;
	width: 23em;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_slogan{
	margin-top: 11px!important;
	margin-bottom: 0px!important;
	font-size: 30px;
	line-height: 40px;
	font-weight: 500;
}

.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage{
	margin-bottom: 0;
	position: absolute;
	bottom: 30px;
	height: 235px;
	display: table;
}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage span{
	display: table-cell;
	height: 235px;
	vertical-align: bottom;
}

/* メイン画像が横幅目一杯、高さ足りない時 */
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh{
	margin-bottom: 0;
	position: absolute;
	bottom: 30px;
	display: table;
}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh span{
	display: table-cell;
	vertical-align: bottom;
}


/* nura用css */
.page-product-hero > div.product_nura section > div h2{
	margin-top: 40px!important;
}
.page-product-hero > div.product_nura > section > div p.main_slogan{
	margin-top: 40px!important;
}

/* satechi用css */
.page-product-hero > div.product_satechi section > div h2{
	margin-top: 60px!important;
}
.page-product-hero > div.product_satechi > section > div p.main_slogan{
	margin-top: 50px!important;
	font-weight:400;
	font-size: 28px;
	line-height: 1.6em;
}

/* barocco用css */
.page-product-hero > div.product_barocco section > div h2{
	margin-top: 35px!important;
	margin-bottom: 40px!important;
}
.page-product-hero > div.product_barocco > section > div p.main_slogan{
	font-weight:400;
	font-size: 26px;
	line-height: 1.8em;
}

/* メインビジュアル ブランド種類別 */
.page-product-hero > div.product_uag,
.page-product-hero > div.product_uag > section > div,
.page-product-hero > div.product_u_by_uag,
.page-product-hero > div.product_u_by_uag > section > div,
.page-product-hero > div.product_jays,
.page-product-hero > div.product_jays > section > div,
.page-product-hero > div.product_nura,
.page-product-hero > div.product_nura > section > div,
.page-product-hero > div.product_ikbc,
.page-product-hero > div.product_ikbc > section > div,
.page-product-hero > div.product_barocco,
.page-product-hero > div.product_barocco > section > div{
	background-color: #eeeeee;
}

.page-product-hero > div.product_satechi,
.page-product-hero > div.product_satechi > section > div{
	background-color: #e9e9e9;
}

.page-product-hero > div.product_uag > section > div p,
.page-product-hero > div.product_jays > section > div p,
.page-product-hero > div.product_nura > section > div p,
.page-product-hero > div.product_ikbc > section > div p{
	color: #444444;
}
.page-product-hero > div.product_satechi > section > div p{
	color: #45474b;
    /*font-family: 'Gotham';*/
}

.page-product-hero > div.product_u_by_uag > section > div p{
	color: #663333;
}
/* メインビジュアルレスポンシブ */
@media only screen and (max-width: 2000px) {	
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 600px;}
.page-product-hero > div.l_logotext_r_mainvisual > section:after{width: 56%;}}
@media only screen and (max-width: 1530px) {
.page-product-hero > div.l_logotext_r_mainvisual > section{padding-left: 40px;}}
@media only screen and (max-width: 1450px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 603px;}
.page-product-hero > div.l_logotext_r_mainvisual > section:after{background-size: auto 100%;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 95%;}}
@media only screen and (max-width: 1400px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 581px; height: 600px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div h2 img{width: 35%;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_compatible {margin-top: 9px!important;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_slogan{margin-top: 8px!important;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh{padding-right: 40px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh img{width:100%;}
.page-product-hero > div.product_nura > section > div h2{margin-top: 35px!important;}
.page-product-hero > div.product_nura > section > div p.main_slogan{margin-top: 35px!important;}
.page-product-hero > div.product_satechi > section > div h2{margin-top: 45px!important;}
.page-product-hero > div.product_satechi > section > div p.main_slogan{margin-top: 45px!important;}
.page-product-hero > div.product_barocco section > div h2{margin-bottom: 30px!important;}}
@media only screen and (max-width: 1350px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 559px;}}
@media only screen and (max-width: 1300px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 537px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 90%;}}
@media only screen and (max-width: 1250px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 515px; height: 550px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_compatible{font-size:16px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_slogan{font-size:26px; line-height: 34px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 85%;}}
@media only screen and (max-width: 1200px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 493px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 80%;}}
@media only screen and (max-width: 1150px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 471px; height: 500px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_compatible{font-size:15px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_slogan{font-size:23px; line-height: 30px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 75%;}
.page-product-hero > div.product_barocco > section > div h2{margin-top: 18px!important; margin-bottom: 25px!important;}}
@media only screen and (max-width: 1100px) {
.page-product-hero > div.l_logotext_r_mainvisual > section{padding-left: 30px;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2{margin-top: 20px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 458px; height: 475px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage,
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh{bottom: 20px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh{padding-right: 30px;}
.page-product-hero > div.product_nura > section > div h2{margin-top: 25px!important;}
.page-product-hero > div.product_nura > section > div p.main_slogan{margin-top: 25px!important;}
.page-product-hero > div.product_satechi > section > div h2{margin-top: 25px!important;}
.page-product-hero > div.product_satechi > section > div p.main_slogan{margin-top: 25px!important;}}
@media only screen and (max-width: 1050px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 436px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 70%;}}
@media only screen and (max-width: 1000px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 414px; height: 450px;}}
@media only screen and (max-width: 950px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 392px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 65%;}}
@media only screen and (max-width: 900px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 370px; height: 425px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_compatible{font-size:14px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_slogan{font-size:21px; line-height: 28px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 60%;}}
@media only screen and (max-width: 835px) {
.page-product-hero > div.l_logotext_r_mainvisual > section:after{display: none;}
.page-product-hero > div.l_logotext_r_mainvisual > section{width: 100%; padding: 0 20px; display: block;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div{width: 100%;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div h2{margin-top: 20px; margin-bottom: 0px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div h2 img{width: 120px}
.page-product-hero > div.l_logotext_r_mainvisual > section > div{height: 220px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_compatible{width: 50%; margin-top: 5px!important;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_slogan{width: 50%; position: absolute; bottom:20px; margin-top: 5px!important;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage,
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh{text-align: right; right: 0px; bottom:20px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh{padding-right: 0px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 65%;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh img{width: 50%;}
.page-product-hero > div.product_nura > section > div h2{margin-top: 10px!important;}
.page-product-hero > div.product_satechi > section > div h2{margin-top: 15px!important;}
.page-product-hero > div.product_barocco > section > div h2{margin-top: 8px!important;}
}
@media only screen and (max-width: 810px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height:0 60%;}}
@media only screen and (max-width: 760px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 55%;}}
@media only screen and (max-width: 720px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_slogan{font-size: 18px; line-height: 26px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 52%;}}
@media only screen and (max-width: 650px) {
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img{height: 48%;}}
@media only screen and (max-width: 620px) {
.page-product-hero > div.l_logotext_r_mainvisual > section{padding: 0 28px;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div{height: auto;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div h2{width: 100%; text-align: center;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div h2 img{width: 42%; margin-top: 10px!important;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_compatible{width: 100%; text-align: center; margin-top: 10px!important;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_slogan{font-size: 18px; line-height: 24px; width: 100%; position:static; text-align: center; margin-top: 15px!important;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage,
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh{width: 100%; position: static; text-align: center; padding: 28px 0;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage img,
.page-product-hero > div.l_logotext_r_mainvisual > section > div p.main_productimage_neh img{width: auto; max-width: 100%; height: auto; max-height: 100%; }}
@media only screen and (max-width: 540px) {
.page-product-hero > div.product_satechi > section > div p.main_productimage span {height: auto!important;}
.page-product-hero > div.product_satechi > section > div p.main_productimage {height: auto!important;}
}
/* 製品別ロゴ */
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.uag img{width: 44%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ripcurl img{width: 70%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ubyuag img{width: 35%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.jays img{width: 33%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.nura img{width: 45%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ikbc img{width: 46%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.satechi img{width: 75%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.barocco img{width: 94%;}
@media only screen and (max-width: 835px) {
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.uag img{width: 22%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ripcurl img{width: 35%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ubyuag img{width: 18%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.jays img{width: 14%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.nura img{width: 23%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ikbc img{width: 20%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.satechi img{width: 40%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.barocco img{width: 60%;}
.page-product-hero > div.l_logotext_r_mainvisual > section > div h2 img{width: 120px}}
@media only screen and (max-width: 620px) {
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.uag img{width: 42%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ripcurl img{width: 66%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ubyuag img{width: 41%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.jays img{width: 36%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.nura img{width: 45%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.satechi img{width: 70%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.ikbc img{width: 44%;}
.page-product-hero > div.l_logotext_r_mainvisual section > div h2.barocco img{width: 85%;}}

/* 説明なし 
@media only screen and (max-width: 835px) {
.page-product-hero > div.l_no_logotext > section > div{display: table!important;}
.page-product-hero > div.l_no_logotext > section > div > h2,
.page-product-hero > div.l_no_logotext > section > div > p{display: table-cell!important; margin: 0!important;}
	
.page-product-hero > div.l_no_logotext > section > div > h2 img,
.page-product-hero > div.l_no_logotext > section > div > p span img{vertical-align: middle!important; display: inline!important;}

.page-product-hero > div.l_no_logotext > section > div > p span img{height: auto!important;}
	
.page-product-hero > div.l_no_logotext > section > div > h2{width: 50%; background-color: antiquewhite;}
.page-product-hero > div.l_no_logotext > section > div > p{background-color: azure;}
	
.page-product-hero > div.l_no_logotext > section > div > p{position: static!important;}
}*/

/* ============================================================
製品ページメインビジュアル 画像真ん中で左にロゴ右にテキスト（プリンストン製品など）
============================================================ */

.page-product-hero > div.l_logo_c_image_r_text{
	box-sizing: border-box;	
	padding: 0px;
	margin: 0;
	width: 100%;
	height: auto;
	overflow: hidden;
	background-color: #eeeeee;
}
.page-product-hero > div.l_logo_c_image_r_text > section{
	overflow: hidden;
	box-sizing: border-box;
	width: 1500px;
	padding: 0 30px;
	margin: 0 auto;
	display: table;
	min-height:500px;
	padding-top: 30px;
	padding-bottom: 30px;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2,
.page-product-hero > div.l_logo_c_image_r_text > section > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div{
	box-sizing: border-box;
	margin: 0;
	display: table-cell;
	vertical-align: middle;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2{
	width: 32%;
	text-align: left;
}
.page-product-hero > div.l_logo_c_image_r_text > section > p{
	width: 40%;	
	text-align: center;
}
.page-product-hero > div.l_logo_c_image_r_text > section > div{
	width: 28%;
	text-align: right;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 span img{
	width: 80%; 
}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p{
	margin: 0;
	width: auto;
	text-align: left;
	display: inline-block;
}
.page-product-hero > div.l_logo_c_image_r_text > section > p > span > img{
	height: 100%;
}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl{
	min-width: 1%;
	display: inline-block;
	text-align: left;
}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div{
	display: inline-block;
}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dt{
	font-size: 2.8em;
	line-height: 1.4em;
	font-weight: bold;
	margin: 0 0 12px;
	color: #333333;
}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd{
	margin: 0;
	width: auto;
}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd{
	font-size: 1.5em;
	line-height: 1.8em;	
	color: #333333;
}

@media only screen and (max-width: 1530px) {
.page-product-hero > div.l_logo_c_image_r_text > section{width: 100%;padding-right:40px;padding-left:40px;}}
@media only screen and (max-width: 1450px) {
.page-product-hero > div.l_logo_c_image_r_text > section > div > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > dd{font-size: 1.4em;line-height: 1.7em;}}
@media only screen and (max-width: 1400px) {
.page-product-hero > div.l_logo_c_image_r_text > section > h2{width: 29%;}
.page-product-hero > div.l_logo_c_image_r_text > section > p{width: 39%;}
.page-product-hero > div.l_logo_c_image_r_text > section > div{width: 32%;}}
@media only screen and (max-width: 1300px) {
.page-product-hero > div.l_logo_c_image_r_text > section{min-height:400px;}
.page-product-hero > div.l_logo_c_image_r_text > section > p > span > img{max-height: 450px;}}
@media only screen and (max-width: 1200px) {
.page-product-hero > div.l_logo_c_image_r_text > section{display: grid;	grid-template-columns:1fr 1fr; padding-top:20px; padding-bottom: 20px;}
.page-product-hero > div.l_logo_c_image_r_text > section > h2{
order: 0; grid-column-start: 1; grid-column-end: 2; grid-row-start: 1; grid-row-end: 2; width: 100%; display: table;padding-bottom: 12px; text-align: left;}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 > span{display: table-cell; vertical-align: middle;}
.page-product-hero > div.l_logo_c_image_r_text > section > div{
order: 1; grid-column-start: 1; grid-column-end: 2; grid-row-start: 2; grid-row-end: 3; width: 100%; display: table;}	
.page-product-hero > div.l_logo_c_image_r_text > section > div > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl{ display: table-cell; vertical-align: middle;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div{display: inline-block;}
.page-product-hero > div.l_logo_c_image_r_text > section > p{
order: 2; grid-column-start: 2; grid-column-end: 3; grid-row-start: 1; grid-row-end: 3;	width: 100%; display: table;}
.page-product-hero > div.l_logo_c_image_r_text > section > p > span{ display: table-cell; vertical-align: middle; text-align: right;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dt{font-size: 2.0em;line-height: 1.4em;margin-bottom: 7px;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd{font-size: 1.4em;line-height: 1.6em;}}
@media only screen and (max-width: 1100px) {
.page-product-hero > div.l_logo_c_image_r_text > section{padding-right:30px;padding-left:30px;min-height:350px;}
.page-product-hero > div.l_logo_c_image_r_text > section > p > span > img{max-height: 400px;}}
@media only screen and (max-width: 950px) {
.page-product-hero > div.l_logo_c_image_r_text > section{min-height:300px; padding-top:15px; padding-bottom: 15px;}
.page-product-hero > div.l_logo_c_image_r_text > section > p > span > img{max-height: 350px;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dt{font-size: 1.8em;line-height: 1.3em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd{font-size: 1.3em;line-height: 1.5em;}}
@media only screen and (max-width: 835px) {
.page-product-hero > div.l_logo_c_image_r_text > section{padding-right:20px;padding-left:20px;min-height:250px;}
.page-product-hero > div.l_logo_c_image_r_text > section > p > span > img{max-height: 300px;}}
@media only screen and (max-width: 720px) {
.page-product-hero > div.l_logo_c_image_r_text > section{min-height:200px;}
.page-product-hero > div.l_logo_c_image_r_text > section > p > span > img{max-height: 250px;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dt{font-size: 1.5em;line-height: 1.3em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd{font-size: 1.1em;line-height: 1.3em;}}
@media only screen and (max-width: 620px) {
.page-product-hero > div.l_logo_c_image_r_text > section{display:flex;flex-direction:column; padding-top:25px; padding-bottom: 25px;}	
.page-product-hero > div.l_logo_c_image_r_text > section > h2{display: block; text-align: center; padding-bottom: 0px; margin-bottom: 22px; }
.page-product-hero > div.l_logo_c_image_r_text > section > h2 span{width: 100%; display: inline;}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 span img{width: 60%;}
.page-product-hero > div.l_logo_c_image_r_text > section > div{ width: 100%; display: block; text-align: center; margin-bottom: 22px;}	
.page-product-hero > div.l_logo_c_image_r_text > section > div > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl{width: 100%; display: block; text-align: center; margin-top: 0; margin-bottom: 0;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd{font-size: 1.2em;line-height: 1.5em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div{display: inline-block;}
.page-product-hero > div.l_logo_c_image_r_text > section > p{ width: 100%; display: block;}
.page-product-hero > div.l_logo_c_image_r_text > section > p > span{ display: inline; text-align: center;}
}
/* 製品別 */

/* プリンストン製品 */
.page-product-hero > div.product_princeton > section > h2 > span > img{width: 80%;}
@media only screen and (max-width: 1200px){.page-product-hero > div.product_princeton > section > h2 > span > img{width: 60%;}}
@media only screen and (max-width: 620px){.page-product-hero > div.product_princeton > section > h2 > span > img{width: 40%;}}
/* UniTAP製品 */
.page-product-hero > div.product_unitap > section > h2 > span > img{width: 80%;}
@media only screen and (max-width: 1200px){.page-product-hero > div.product_unitap > section > h2 > span > img{width: 50%;}}
@media only screen and (max-width: 620px){.page-product-hero > div.product_unitap > section > h2 > span > img{width: 40%;}}
/* Edifire製品 */
.page-product-hero > div.product_edifire > section > h2 > span > img{width: 80%;}
@media only screen and (max-width: 1200px){.page-product-hero > div.product_edifire > section > h2 > span > img{width: 50%;}}
@media only screen and (max-width: 620px){.page-product-hero > div.product_edifire > section > h2 > span > img{width: 40%;}}
/* Digizo製品 */
.page-product-hero > div.product_digizo > section > h2 > span > img{width: 70%;}
@media only screen and (max-width: 1200px){.page-product-hero > div.product_digizo > section > h2 > span > img{width: 40%;}}
@media only screen and (max-width: 620px){.page-product-hero > div.product_digizo > section > h2 > span > img{width: 30%;}}
/* EzcastPro製品 */
.page-product-hero > div.product_ezcastpro > section > h2 > span > img{width: 80%;}
@media only screen and (max-width: 1200px){.page-product-hero > div.product_ezcastpro > section > h2 > span > img{width: 70%;}}
@media only screen and (max-width: 620px){.page-product-hero > div.product_ezcastpro > section > h2 > span > img{width: 50%;}}
/* Ezcast製品 */
.page-product-hero > div.product_ezcast > section > h2 > span > img{width: 65%;}
@media only screen and (max-width: 1200px){.page-product-hero > div.product_ezcast > section > h2 > span > img{width: 45%;}}
@media only screen and (max-width: 620px){.page-product-hero > div.product_ezcast > section > h2 > span > img{width: 35%;}}
/* UltraPlus製品 */
.page-product-hero > div.product_ultra_plus{background-color: #000000!important;}
.page-product-hero > div.product_ultra_plus > section > h2 > span > img{width: 89%;}
.page-product-hero > div.product_ultra_plus > section > div > dl > div > dt{color: #e0e000;}
.page-product-hero > div.product_ultra_plus > section > div > dl > div > dd{color: #ffffff;}
@media only screen and (max-width: 1200px){.page-product-hero > div.product_ultra_plus > section > h2 > span > img{width: 85%;}}
@media only screen and (max-width: 620px){.page-product-hero > div.product_ultra_plus > section > h2 > span > img{width: 55%;}}	
/* TALOG製品 */
.page-product-hero > div.product_talog > section > h2 > span > img{width: 70%;}
@media only screen and (max-width: 1200px){.page-product-hero > div.product_talog > section > h2 > span > img{width: 52%;}}
@media only screen and (max-width: 620px){.page-product-hero > div.product_talog > section > h2 > span > img{width: 55%;}}

/*テキスト位置調整用*/
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_15em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_15em{min-width: 15em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_14em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_14em{min-width: 14em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_13em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_13em{min-width: 13em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_12em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_12em{min-width: 12em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_11em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_11em{min-width: 11em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_10em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_10em{min-width: 10em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_9em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_9em{min-width: 9em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_8em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_8em{min-width: 8em;}
.page-product-hero > div.l_logo_c_image_r_text > section > div > p.txt_7em,
.page-product-hero > div.l_logo_c_image_r_text > section > div > dl > div > dd.txt_7em{min-width: 7em;}

/*受賞メダル表示*/
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong{
	display: block;
	text-align: center;
	margin-top: 35px;
	width: 80%;
	margin-right: 20%;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong img{
	width: 47%; 
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong img:nth-of-type(n+2){
	margin-left: 6%;
}
@media only screen and (max-width: 1200px) {
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong{
	display: table-cell;
	width: 26%;
	margin-top: 5px;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong img{
	width: 99%; 
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong img:nth-of-type(n+2){
	margin-left: 0; margin-top: 15px;
}
}
@media only screen and (max-width: 620px) {
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong{
	display: block!important;
	text-align: center!important;
	margin-top: 20px;
	width: 100%;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong img{
	width: 150px; 
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong img:nth-of-type(n+2){
	margin-left: 4%; margin-top: 0px;
}
}

/*受賞メダル横長の場合*/
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls{
	margin-right: 25%;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls img{
	width: 65%; 
}
@media only screen and (max-width: 1200px) {
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls{
	display: table-cell;
	text-align: right;
	vertical-align: top;
	width: 22%;
	margin-right: 0%;
	position: relative;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls img{
	padding-right: 0;
	width: 100%;
	position: absolute;
	left:50px;
}
}
@media only screen and (max-width: 975px) {
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls img{
	left:0px;
}
}
@media only screen and (max-width: 850px) {
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls{
	width: 35%;
}
}
@media only screen and (max-width: 620px) {
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls{
	display: block;
	position: static;
	text-align: center;
	margin-top: 20px;
	width: 100%;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls img{
	width: 30%; 
	position: static;
}
.page-product-hero > div.l_logo_c_image_r_text > section > h2 strong.awardls img:last-child{
	margin-left: 0; margin-top: 0px;
}
}
/* ============================================================
製品ページ ブランド説明
============================================================ */

.bland_description{
	width: 1300px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
}

.bland_description > div{
	width: 100%;
	overflow: hidden;
	margin: 50px 0;
	background-color: #dddddd;
	height: 400px;
}

.bland_description > div > div{
	width: 670px;
	height: 400px;
	display: table;
	position: absolute;
	left: 570px;
	box-sizing: border-box;
}

.bland_description > div > div > div{
	display: table-cell;
	vertical-align: middle;
}

.bland_description > p{
	position: absolute;
	top: -15px;
	left: 40px;
}

.bland_description > div > div > div h3{	
	font-size: 1.6em;
	line-height: 1.2em;
	margin-top: 0;
	margin-bottom: 20px;
}

.bland_description > div > div > div p{
	font-size: 1.2em;
	color: #333333;
	line-height: 1.8em;
	margin-top: 0;
	margin-bottom: 0px; 
}
@media only screen and (max-width: 1400px) {
.bland_description{padding: 0 40px 0; width: 100%;}}
@media only screen and (max-width: 1350px) {.bland_description > div > div{width:630px;}}
@media only screen and (max-width: 1325px) {.bland_description > div > div{width:610px;}}
@media only screen and (max-width: 1300px) {
.bland_description > div > div{width:600px; left: 590px;}
.bland_description > p{left: 70px;}}
@media only screen and (max-width: 1275px) {.bland_description > div > div{width:570px;}}
@media only screen and (max-width: 1250px) {.bland_description > div > div{width:550px;}}
@media only screen and (max-width: 1225px) {.bland_description > div > div{width:530px;}}
@media only screen and (max-width: 1200px) {
.bland_description > div{height: 330px;}
.bland_description > div > div{width:570px; height: 330px; left:505px;}
.bland_description > p{left: 70px;}
.bland_description > p img{width: 400px;}}
@media only screen and (max-width: 1175px) {.bland_description > div > div{width:530px;}}
@media only screen and (max-width: 1150px) {.bland_description > div > div{width:490px;}}
@media only screen and (max-width: 1125px) {.bland_description > div > div{width:450px;}}
@media only screen and (max-width: 1100px) {
.bland_description > div{height: 300px;}
.bland_description{padding: 0 30px;}
.bland_description > div > div{width:530px; height: 300px; left: 450px;}
.bland_description > p{left: 50px; top:0;}
.bland_description > p img{width: 360px;}}
@media only screen and (max-width: 1075px) {.bland_description > div > div{width:500px;}}
@media only screen and (max-width: 1050px) {.bland_description > div > div{width:470px;}}
@media only screen and (max-width: 1025px) {.bland_description > div > div{width:450px;}}
@media only screen and (max-width: 1000px) {
.bland_description > div{height: 280px;}
.bland_description > div > div{width:480px; height: 280px; left: 410px;}
.bland_description > p img{width: 330px;}
.bland_description > div > div > div h3{font-size: 1.4em; margin-bottom: 20px;}
.bland_description > div > div > div p{font-size: 1.1em; line-height: 1.6em; margin-bottom: 15px;}}
@media only screen and (max-width: 975px) {.bland_description > div > div{width:450px;}}
@media only screen and (max-width: 950px) {
.bland_description > div{height: 260px;}
.bland_description > div > div{width:460px; height: 260px; left: 390px;}
.bland_description > p{left: 60px; top:10px;}
.bland_description > p img{width: 300px;}}
@media only screen and (max-width: 925px) {.bland_description > div > div{width:430px;}}
@media only screen and (max-width: 900px) {
.bland_description > div{height: 240px;}
.bland_description > div > div{width:440px; height: 240px; left: 350px;}
.bland_description > p{left: 50px; top:10px;}
.bland_description > p img{width: 280px;}
.bland_description > div > div > div h3{font-size: 1.3em;}
.bland_description > div > div > div p{font-size: 1.0em; line-height: 1.4em;}}
@media only screen and (max-width: 875px) {.bland_description > div > div{width:430px;}}
@media only screen and (max-width: 850px) {.bland_description > div > div{width:400px;}}
@media only screen and (max-width: 835px) {
.bland_description{padding: 0 20px; display:table; background-color:#dddddd;}
.bland_description > div{ display:table-cell; height: 130px; vertical-align:middle; padding-right:15px; width: auto;}
.bland_description > div > div{width:100%; height: 120px; left: 0;position: static;}
.bland_description > p{display:table-cell; vertical-align:middle; position: static; width: 150px; left: 0;}
.bland_description > p img{width: 150px; margin-top:10px}
.bland_description > div > div > div h3{margin-bottom:8px;}
.bland_description > div > div > div p{font-size: 0.9em;}}


/* ============================================================
製品ページ ULTRA PLUS用スタイル
============================================================ */
div.ultra_plus_wrapper{
	width: 100%;
	background-color: #010101;
	background-image: url(/static/images/product/ultra_plus/ultra_plus_bg01.jpg);
	background-position: 50% 450px;
	background-repeat: no-repeat;
	background-size: 2400px;
}

/*↓ロゴ変更後の画像位置調整↓*/
div.ultra_plus_bg2{
	background-position: 50% 580px!important;
}
/*↑ロゴ変更後の画像位置調整↑*/

div.ultra_plus_wrapper h3,
div.ultra_plus_wrapper h4,
div.ultra_plus_wrapper h5,
div.ultra_plus_wrapper dt,
div.ultra_plus_wrapper p,
div.ultra_plus_wrapper ul li,
div.ultra_plus_wrapper ol li,
div.ultra_plus_wrapper dl dt,
div.ultra_plus_wrapper dl dd{color: #ffffff;}

div.ultra_plus_wrapper .comparison_table{border-color: #ffffff;	color: #ffffff;}
div.ultra_plus_wrapper .comparison_table th{color: #e0e000;}
div.ultra_plus_wrapper .comparison_table tr:first-child th{	border-color:#ffffff; background-color: #ffffff; color: #111111!important;}
div.ultra_plus_wrapper .comparison_table tr:first-child th:first-child{	border-right-color:#000000;}
div.ultra_plus_wrapper .comparison_table tr td:first-child,
div.ultra_plus_wrapper .comparison_table tr th:first-child{	border-right-color:#ffffff;}

div.ultra_plus_wrapper h3.ultra_plus_underline{font-size: 2.0em;}
div.ultra_plus_wrapper section section div div h4{font-size: 1.4em;}
div.ultra_plus_wrapper section h4.txt_ultraplus{font-size: 1.4em; margin-bottom: 20px;}
div.ultra_plus_wrapper section section div div p > span{font-size: 1.2em;}

@media only screen and (max-width: 1200px) {
div.ultra_plus_bg2{background-position: 50% 500px!important;}
div.ultra_plus_wrapper h3.ultra_plus_underline{font-size: 1.8em;}
div.ultra_plus_wrapper section section div div h4{font-size: 1.3em; line-height: 1.2em;}
div.ultra_plus_wrapper section h4.txt_ultraplus{font-size: 1.3em; line-height: 1.3em;}
div.ultra_plus_wrapper section section div div p > span{font-size: 1.1em; line-height: 1.2em;}}	
@media only screen and (max-width: 1000px) {
div.ultra_plus_bg2{background-position: 50% 440px!important;}
div.ultra_plus_wrapper h3.ultra_plus_underline{font-size: 1.6em;}
div.ultra_plus_wrapper section section div div h4{font-size: 1.2em; line-height: 1.1em;}
div.ultra_plus_wrapper section h4.txt_ultraplus{font-size: 1.2em; margin-bottom: 13px;}
div.ultra_plus_wrapper section section div div p > span{font-size: 1.0em; line-height: 1.1em;}}

.ultra_plus_underline,
.ultra_plus_underline_mnone{
	padding: 0 0 15px;
	border-bottom: #e0df00 solid 5px;
	margin-bottom: 40px;
	overflow: hidden;
}
@media only screen and (max-width: 835px) {
div.ultra_plus_wrapper h3.ultra_plus_underline{font-size: 1.3em;}
div.ultra_plus_wrapper section section div div h4{line-height: 1.0em;}
div.ultra_plus_wrapper section section div div p > span{line-height: 0.9em}
.ultra_plus_underline{margin-bottom: 25px;}
.ultra_plus_underline_mnone{padding-bottom: 0; border: none; margin-bottom: 25px;}}

/*リフレッシュレート*/
.description_mimgs_1column > dl div dd.rr_yellow_large,
.description_mimgs_1column > dl div dd.rr_yellow_small{
	color: #e0e000;
}
.description_mimgs_1column > dl div dd.rr_gray_large,
.description_mimgs_1column > dl div dd.rr_gray_small{
	color: #888888;
}
.description_mimgs_1column > dl div dd.rr_yellow_large,
.description_mimgs_1column > dl div dd.rr_gray_large{
	font-size: 3.0em;
	font-weight: bold;
	margin-top: 30px;
}
.description_mimgs_1column > dl div dd.rr_yellow_small,
.description_mimgs_1column > dl div dd.rr_gray_small{
	font-size: 1.4em;
	margin: 20px 0 30px;
}

@media only screen and (max-width: 1400px) {
.description_mimgs_1column > dl div dd.rr_yellow_large, .description_mimgs_1column > dl div wsdd.rr_gray_large{font-size: 2.6em;}
.description_mimgs_1column > dl div dd.rr_yellow_small, .description_mimgs_1column > dl div dd.rr_gray_small{font-size: 1.3em;}}

@media only screen and (max-width: 1000px) {
.description_mimgs_1column > dl div dd.rr_yellow_large, .description_mimgs_1column > dl div dd.rr_gray_large{font-size: 2.4em;}
.description_mimgs_1column > dl div dd.rr_yellow_small, .description_mimgs_1column > dl div dd.rr_gray_small{font-size: 1.2em;}}

@media only screen and (max-width: 835px) {
.description_mimgs_1column > dl div dd.rr_yellow_large, .description_mimgs_1column > dl div dd.rr_gray_large{font-size: 2.0em; margin-top: 15px;}
.description_mimgs_1column > dl div dd.rr_yellow_small, .description_mimgs_1column > dl div dd.rr_gray_small{font-size: 0.9em; margin: 10px 0 15px;}}

/* ULTRA PLUS テーブル表組 */
table.ultra_plus_table tr td,
table.ultra_plus_table tr th{
	text-align: center;
	vertical-align: middle;
}
table.ultra_plus_table tr td{
	color: #ffffff!important;
}
table.ultraplus_table tr th{
	color: #444444!important;
}

/*以下要確認*/
/*================================================
UAGショルダーストラップ
================================================*/
.shoulderstrap_table{
     margin-top:-40px;                                        
}         
.shoulderstrap_table th, .shoulderstrap_table td {
    border: solid 1px #bbbbbb;
    padding: 10px; 
}
.shoulderstrap_table th{
 background-color:#eeeeee!important;
 }
.shoulderstrap_table th.shoulderstrap_th{
 background-color:#dddddd!important;
 } 
.shoulderstrap_table{
    border-collapse:  collapse; 
}

table.table-bordered th{
 background-color:#eeeeee!important;	
}

/*================================================
   クーピーコラボアクティブスタイラスペン
================================================*/
.page-product-hero > .coupy_top{
	width:100%;
	background-color: #eeeeee;
	box-sizing: border-box;
	text-align: center;
	overflow: hidden;
}
.page-product-hero > .coupy_top p{
	width:1400px;
	padding: 0 25px;
	margin: 0 auto;
	box-sizing: border-box;
}
.page-product-hero > .coupy_top p img{
	margin: 0!important;
	vertical-align:top;
}

@media only screen and (max-width: 1400px) {
.page-product-hero > .coupy_top p{padding: 0 40px 0; width: 100%;}
}
@media only screen and (max-width: 1080px) {
.page-product-hero > .coupy_top p{padding: 0 20px;}
}

/*================================================
   DISPLAY 規格に適応しています。
================================================*/

.page-product-fit_table th,.page-product-fit_table td{
	vertical-align: middle!important;
}
.page-product-fit_table th div{
	display: inline-block!important;	
}

/*================================================
   ディスプレイ製品仕様の※欄
================================================*/
.product_display_spec section{
	margin-top: 50px;
}

.product_display_spec section h5{
	font-weight: bold;
	font-size: 1.3em;
	margin-top: 0;
	margin-bottom: 10px;
}

@media only screen and (max-width: 835px) {
.product_display_spec section{margin-top: 35px;}
.product_display_spec section h5{font-size: 1.1em;margin-bottom: 15px;}
}

/*================================================
   アプリ一覧など
================================================*/

.product_application h3{
	text-align: left!important;
	font-size: 1.2em!important;
}

.product_application dl div{
	display: table;
	width: 100%;
	margin-bottom: 15px;
}
.product_application dl div dt,
.product_application dl div dd{
	display: table-cell;
	vertical-align: middle;
	text-align: left;
	margin: 0;
}
.product_application dl div dt{
	width: 110px;
}
.product_application dl div dt img{
	width: 90px;
	vertical-align: middle;
}

@media only screen and (max-width: 835px){
.product_application dl div dt{width: 90px;}
.product_application dl div dt img{width: 70px;}
}


/*================================================
   ご購入はこちら自分で作成する場合に使用
================================================*/
.page-product-buy-self{
    background: rgba(0,0,0,0.02);
    padding: 100px 0 80px;
	margin-top: 95px;
}
.page-product-buy-self > div{
	margin-bottom: 80px;
}
.page-product-buy-self > div:last-child{
	margin-bottom: 0px;
}
@media only screen and (max-width: 835px){
.page-product-buy-self{padding: 40px 0;	margin-top: 40px;}
.page-product-buy-self > div{margin-bottom: 50px;}
}