@charset "UTF-8";
/* auther: cee; */

article input {display:none;}
article #kv {background-image: url(/jpn/images/safety/persistence/kv_bg.jpg);}

article .message.suzuki .container::before {background-image: url(/jpn/images/safety/persistence/message_suzuki_bg.jpg);}
article .message.nakai .container::before {background-image: url(/jpn/images/safety/persistence/message_nakai_bg.jpg);}

article .takumi .box::after {
max-width: 640px;
width: 100%;
height: 280px;
margin: 60px auto 0;
content: '';
visibility: visible;
background-repeat: no-repeat;
background-size: cover;
display: block;
clear: both;
}
article .takumi.mold .box::after {
background-image: url(/jpn/images/safety/persistence/takumi_mold.jpg);
background-position: center bottom;
}
article .takumi.liner .box::after {
background-image: url(/jpn/images/safety/persistence/takumi_liner.jpg);
background-position: center center;
}
article .material.summary {color: #fff;}
article .material.summary .wrap:nth-of-type(2) {
background: url(/jpn/images/safety/persistence/material.jpg) no-repeat left bottom;
background-size: cover;
}
article .material.summary .box:nth-of-type(1) {background: #2a2a2a;}
article .material.summary .box:nth-of-type(2) {background: #1e1e1e;}
article .material.summary .box:nth-of-type(3) {background: #131313;}
article .material.summary .box:nth-of-type(4) {background: #2a2a2a;}
article .material.summary .box label {display: block;}
article .material.summary .box label::before {
margin-bottom: 20px;
color: rgba(209,209,209,.4);
font-family: 'Roboto', sans-serif;
font-weight: 500;
line-height: 1.5em;
border-bottom: 3px solid rgba(209,209,209,.4);
display: inline-block;
}
article .material.summary .wrap:nth-of-type(1) .box:nth-of-type(1) label::before {content: 'ORIGINAL RESIN';}
article .material.summary .wrap:nth-of-type(1) .box:nth-of-type(2) label::before {content: 'COMPLEX LAMIATE CONSTRUCTION';}
article .material.summary .wrap:nth-of-type(1) .box:nth-of-type(3) label::before {content: 'SUPER FIBER BELTED';}
article .material.summary .wrap:nth-of-type(2) .box > span:nth-of-type(1) label::before {content: 'MULTI DENSITY LINER';}
article .material.summary .box h4 {text-align: left;}
article .material.summary .box h4::before {
width: 100%;
margin-bottom: 20px;
content: '';
background: no-repeat left center;
background-size: cover;
display: block;
clear: both;
}
article .material.summary .resin h4::before {background-image: url(/jpn/images/safety/persistence/material_resin.jpg);}
article .material.summary .clc h4::before {background-image: url(/jpn/images/safety/persistence/material_clc.jpg);}
article .material.summary .fiber h4::before {background-image: url(/jpn/images/safety/persistence/material_fiber.jpg);}
article .material.summary .liner h4::before {background-image: url(/jpn/images/safety/persistence/material_liner.png);}
article .material.summary .liner h4::before {background-size: contain;}
article .material.summary .box h4 span {opacity: .4;}
article .test.summary {color: #fff;}
article .test.summary .container {
max-width: 100%;
padding: 0;
}
article .test.summary ul {position: relative;}
article .test.summary ul::before {
height: 100%;
content: '';
background: url(/jpn/images/safety/persistence/test.jpg) no-repeat center center;
background-size: cover;
position: absolute;
left: 0;
top: 0;
}
article .test.summary li:nth-of-type(odd) {background: rgb(37,37,37);}
article .test.summary li:nth-of-type(even) {background: rgb(42,42,42);}
article .test.summary h4 {
text-align: left;
font-family: 'Noto Sans JP', sans-serif;
}
@media all and (-ms-high-contrast: none) {
	article .test.summary h4 {font-family: 'メイリオ', 'Meiryo', 'MS PGothic', 'Hiragino Kaku Gothic ProN', sans-serif;}
}
article .test.summary li label {display: block;}
article .test.summary li label::before {
margin-bottom: 5px;
color: rgba(209,209,209,.4);
font-family: 'Roboto', sans-serif;
font-weight: 500;
line-height: 1.5em;
border-bottom: 3px solid rgba(209,209,209,.4);
display: inline-block;
}
article .test.summary li:nth-of-type(1) label::before {content: 'IMPACT TEST';}
article .test.summary li:nth-of-type(2) label::before {content: 'SHELL PENETRATION TEST';}
article .test.summary li:nth-of-type(3) label::before {content: 'DYNAMIC RETENTION TEST';}
article .test.summary li:nth-of-type(4) label::before {content: 'POSITIONAL STABILITY TEST';}
article .test.summary li:nth-of-type(5) label::before {content: 'CHIN BAR TEST';}
article .test.summary li:nth-of-type(6) label::before {content: 'ARAI SAFETY STANDARDS';}
article .test.summary ul + p {
max-width: 100%;
padding: 20vw 10vw;
font-family: 'Noto Serif JP', serif;
text-align: center;
background: url(/jpn/images/safety/persistence/test_persistence.jpg) no-repeat center center;
background-size: cover;
position: relative;
}
@media all and (-ms-high-contrast: none) {
	article h2 {font-family: '游明朝', 'Yu Mincho', 'YuMincho', 'HGS明朝E', 'メイリオ', 'Meiryo', serif;}
}
article .test.summary ul + p::before {
width: 100%;
height: 100%;
content: '';
background: url(/jpn/images/safety/persistence/test_persistence_bg.png) no-repeat center center;
background-size: cover;
position: absolute;
left: 0;
top: 0;
}
article .test.summary ul + p span:nth-of-type(1) {
margin-bottom: .5em;
padding-right: 6em;
display: inline-block;
position: relative;
}
article .test.summary ul + p span:nth-of-type(1)::after {
width: 5em;
height: 1px;
margin: auto 0;
content: '';
visibility: visible;
background: #fff;
position: absolute;
right: 0;
top: 0;
bottom: 0;
}
article .test.summary ul + p span + span {display: block;}

@media all and (min-width:995px) {
	article .design {padding: 150px 0;}
	article .takumi .box::after {margin-left: 0;}
	article .material.title {padding: 150px 0;}
	article .material.summary .container {
	max-width: 100%;
	margin: 0;
	padding: 0;
	}
	article .material.summary .wrap {
	width: 100%;
	background: linear-gradient(90deg, #2a2a2a, #131313);
	display: table;
	}
	article .material.summary .wrap:nth-of-type(2) {
	padding-left: 33.34%;
	}
	article .material.summary .wrap .box {
	padding: 60px 20px;
	vertical-align: top;
	display: table-cell;
	}
	article .material.summary .wrap:nth-of-type(1) .box {width: 33.33%;}
	article .material.summary .box:nth-of-type(-n+2) {border-right: 1px solid rgba(209,209,209,.1);}
	article .material.summary .box label::before {font-size: 18px;}
	article .material.summary .box h4::before {height: 200px;}
	article .material.summary .liner > span {
	max-width: calc(50% - 20px);
	display: block;
	}
	article .material.summary .liner > span:nth-of-type(1) {float: left;}
	article .material.summary .liner > span:nth-of-type(2) {float: right;}
	article .material.summary .snell {padding-bottom: 26px;}
	article .material.summary .snell .button {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 64px;
	}
	article .test.title {padding: 150px 0;}
	article .test.summary ul {padding-left: calc(10vw + 300px);}
	article .test.summary ul::before {width: calc(10vw + 300px);}
	article .test.summary li {padding: 60px 20px;}
	article .test.summary li p {margin-left: 0;}
	article .test.summary ul + p span:nth-of-type(1) {margin-right: 6em;}
	article .test.summary ul + p span + span {font-size: 24px;}
	article .test.summary label::before {font-size: 18px;}
}
@media all and (max-width:994.9px) {
	article .design {padding: 120px 0;}
	article .material.title {padding: 120px 0;}
	article .material.summary .container {
	margin: 0;
	padding: 0;
	}
	article .material.summary .box {padding: 60px 10vw;}
	article .material.summary .box:nth-of-type(-n+2) {border-bottom: 1px solid rgba(209,209,209,.1);}
	article .material.summary .box label,
	article .material.summary .box h4 {
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
	}
	article .material.summary .box label::before {font-size: 16px;}
	article .material.summary .box h4::before {height: 150px;}
	article .material.summary .liner h4::before {background-position: center center;}
	article .material.summary .snell .button {margin-top: 30px;}
	article .test.title {padding: 120px 0;}
	article .test.summary ul {padding: 20px;}
	article .test.summary ul::before {
	width: 100%;
	z-index: -1;
	}
	article .test.summary li {padding: 40px 20px;}
	article .test.summary label {
	max-width: 640px;
	margin: auto;
	}
	article .test.summary label::before {font-size: 16px;}
	article .test.summary ul + p span + span {font-size: 20px;}
}