@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700|Roboto:400,700&display=swap');

/*****************************************************-
CSS Document : PC Design
- ****************************************************/
body{ font-weight:400; font-family: 'Roboto', 'Noto Sans JP','Noto Sans Japanese', sans-serif;}

h2{ font-weight:100;}
header,
footer .ft-note{ font-weight:400 !important;}

.pc-only{ display: block;}
.sp-only{ display: none !important;}

.product-nav-flex ul li{ font-weight:400 !important;}
.product-info .breadcrumb{ margin-top: 0 !important;}

/*.product-nav .nav-col li p a,
.product-nav .nav-col li.stay p a,
.product-nav .nav-col li p a:hover{ padding:9px 15px 8px;}*/

main .info-ttl { display:block; background:url(/product/phone/f-51a/contents/images/1/f-51a-header.png) no-repeat center top; width:100%; height: 120px;}
main .info-ttl p img { position: absolute; clip: rect(1px, 1px, 1px, 1px); width: 1px; height: 1px;}
.product-info .page-ttl { display:none;}

section { border-bottom: none; padding-top: 0; padding-bottom: 0;}

section:nth-child(2n+0) { background:#ffffff;}
section:nth-child(2n+1) { background:#eeefef;}
section.design-dtl .design-copy{background:#434b4c; text-align:center;}

.product-info .design-dtl .dtl-ttl { line-height: 1.2; font-size: 231%; /*30px*/ text-align: center; margin-bottom:15px;}
.product-info .design-dtl p + .dtl-ttl{ margin-top:25px;}

/*===========================================================================
 Design settings
===========================================================================*/
.video-conts{ position:relative; text-align: center; background: #000;}
.headline{ position: absolute; left: 50%; top: 50%; color: #fff; width: 980px; height: 280px; margin-left: -490px; margin-top: -140px;}
.headline h2{ font-weight: bold; font-size: 500%; line-height: 1.2; margin-bottom:50px;}
.headline h2 span{ display: block; font-size:30%;}
.headline p{ font-size:131%;}
video{ width:1280px; height: auto; vertical-align: bottom;}

.design-dtl { overflow:hidden;}
.design-dtl p { font-size: 131%;}

/*.cat_img img{ display:none;}*/
section.design-dtl .cts-inr .dtl-ttl span{ font-size:80%;}
section.design-dtl .cts-inr p { text-align:left; padding:0;}

section.design-dtl .cat_img{ display: flex; width: 980px; margin-left:auto; margin-right:auto;}
section.design-dtl .cat_img > div{ width:50%; margin:0;}
section.design-dtl .cat_img img{ display: none;}

/* メイン画像 */
.design-dtl .main-img{ position:relative; min-height:700px; background: url(/product/phone/f-51a/contents/images/1/design01.png) no-repeat center 50%}
.main-img .Copy{ width:100%; text-align: center; font-size:277%; font-weight:100; color:#fff; position:absolute; bottom:32px; line-height:1.4em;}
.main-img .subCopy{ width:100%; text-align:center; position:absolute; left:0; bottom:2.5em;}
.main-img .subCopy p{ font-size:116%; font-weight:100;}

/* a-block */
section.design-dtl.a-block { display: flex; /*align-items: center;*/ min-height: 480px; background: url(/product/phone/f-51a/contents/images/1/design02.png) no-repeat center top;}
section.design-dtl.a-block .cat_img{ flex-direction:row-reverse;}
section.design-dtl.a-block .cts-inr .cnt-txt { padding-right: 30px;padding-top: 10%;}

/* b-block */
section.design-dtl.b-block { display: flex; /*align-items: center;*/ min-height: 480px; background: #eeefef url(/product/phone/f-51a/contents/images/1/design03.png) no-repeat center top;}
section.design-dtl.b-block .cts-inr .cnt-txt { padding-left: 30px; padding-top: 25%;}

/* c-block */
section.design-dtl.c-block{
	border-bottom: 1px solid #d2d2d2;
}
section.design-dtl.c-block .cts-inr{
	padding:75px 0;
}
section.design-dtl .cts-inr p.gd-img{
	text-align:center;
}
.gd-img img{
	width: auto;
	max-width: 300px;
	height: auto;
}

/* カラーバリエーション */
section.design-dtl.color-block{background: #fff;}
.design-dtl.color-block .cts-inr { padding:80px 0 30px; overflow:hidden;}
.design-dtl.color-block .cts-inr .image_g{ margin-bottom:5em;}
section.design-dtl.color-block .cts-inr h2.dtl-ttl { text-align:center; }
section.design-dtl.color-block .cts-inr p.color-txt { text-align:center; margin-bottom:3em;}
.color-block dl { width:50%; margin:0 0 40px; float:left;}
/*.color-block dl:last-of-type{ float:none; margin:0 auto;}*/
.color-block dl dt { text-align:center; padding-bottom:20px;}
.color-block dl dd { text-align:center; padding-bottom:0; width:80%; margin: 0 auto;}
.color-block dl p.color-name { text-align:center; font-size:182%; margin:12px 0;}
.color-block dl p b{ font-weight:100; border-bottom:solid 1px #396; }
.color-block dl img{ width:400px; height:auto;}

/* 最下部 */
.design-dtl .design-footer { overflow:hidden; background:#eeefef; padding-bottom:50px;}
.design-dtl .design-footer .cts-inr{ width:900px; margin:0 auto; padding:50px 0;}
.design-dtl .design-footer .Models-photo { width: 51%; float:left; padding:0; text-align:center; }
.design-dtl .design-footer .Model-name { width:48%; margin-left:52%; padding:0; text-align:left;}
.design-dtl .design-footer .Model-name img{ padding:160px 0 0 50px;}