@charset "utf-8";

#sub {}

/* sub-visual */
.sub-visual {height: 476px; background-repeat:no-repeat; background-size:cover; background-position:center center; padding-top:100px; font-family:'Noto Sans SC';}
.sub-visual .contain {height:auto;}
.sub-visual01 {background-image:url('../img/sub/sub-visual01.jpg');}
.sub-visual02 {background-image:url('../img/sub/sub-visual02.jpg');}
.sub-visual03 {background-image:url('../img/sub/sub-visual03.jpg');}
.sub-visual04 {background-image:url('../img/sub/sub-visual04.jpg');}
.sub-visual .title {height:calc(100% - 70px); display:flex; align-items:center; justify-content:center; text-align:center;}
.sub-visual .title h2 {font-size:48px; line-height:1.2em; color:#fff;}
/* lnb */
.sub-visual .lnb {background:#fff;}
.sub-visual .lnb ul {display:flex;}
.sub-visual .lnb ul li {width:100%;}
.sub-visual .lnb ul li a {font-size:22px; line-height:1.4em; color:#666; height:70px; display:flex; align-items:center; justify-content:center; padding:5px; border-bottom:1px solid #eee; border-right:1px solid #eee; transition:all 0.4s; text-align:center;}
.sub-visual .lnb ul li:last-child a {border-right:0;}
.sub-visual .lnb ul li.active a {background:#0157D6; color:#fff; font-weight:700; border-bottom-color:#0157D6;}
.sub-visual .lnb ul li a:hover {background:#0157D6; color:#fff; border-bottom-color:#0157D6;}
.sub-visual .lnb ul li a sup {font-size:16px; line-height:1.1em; margin-top:-12px;}
/* sub common */
.real-cont {margin-bottom:180px;}

.sub-title {padding:80px 0 120px; text-align:center;}
.sub-title h3 {font-size:40px; line-height:1.4em; color:#070707;}

.doc-tit {margin-bottom:50px;}
.doc-tit h4 {font-size:36px; color:#0157d6; line-height:1.4em;}
/* sub 01 */
.about {position:relative;}
.about .menu {position:absolute; top:0; left:260px; z-index:10; background:#fff; width:238px; padding:50px 0;}
.about .menu.on {position:fixed; top:100px;}
.about .menu li {margin-bottom:16px; overflow:hidden;}
.about .menu li:last-child {margin-bottom:0;}
.about .menu li a {font-size:20px; line-height:28px; font-weight:400; color:#222; position:relative; padding-left:30px;}
.about .menu li.active a {font-weight:600;}
.about .menu li a:before {content:''; width:4px; height:16px; background:#0157D6; position:absolute; top:50%; margin-top:-8px; left:0; transition:all 0.4s; opacity:0; transform:translateX(-5px);}
.about .menu li.active a:before {opacity:1; transform:translateX(0);}
.about .wrap {margin-bottom:200px;}
.about .cnt {padding-left:240px; position:relative;}
.about .cnt-tit {margin-bottom:50px;}
.about .cnt-tit h4 {font-size:80px; line-height:1.2em; color:#070707; position:relative; padding-right:200px; display:inline-block;}
.about .cnt-tit h4:after {content:''; width:160px; height:4px; background:#0157D6; position:absolute; top:50%; margin-top:-2px; right:0;}
.about .cnt01 .img-box {position:relative; height:474px; margin-top:0; margin-bottom:50px;}
.about .cnt01 .img-box img {position:absolute; top:0; left:-120px; width:1538px; max-width:none; box-shadow: 20px 40px 60px 0 rgba(0, 0, 0, 0.25);}
.about .cnt .cnt-txt {padding-left:240px;}
.about .cnt .cnt-txt p {font-size:24px; line-height:1.4em; color:#222; margin-bottom:38px;}
.about .cnt .cnt-txt p:last-child {margin-bottom:0;}
.about .cnt .cnt-txt p.tar {text-align:right;}
.about .cnt02 .cnt-txt {margin-bottom:70px;}
.about .cnt02 .col {padding-left:60px; margin:0 -20px; display:flex;}
.about .cnt02 .col .row {width:33.333333%; padding:0 20px; text-align:center;}
.about .cnt02 .col .row p {font-size:24px; line-height:1.4em; color:#222; font-weight:700; margin-top:30px;}
.about .message {padding:150px 0; background:url('../img/sub/message-bg.jpg') center center no-repeat; position:relative; background-size:cover;}
.about .message .img-box {position:absolute; bottom:-300px; left:-20px;}
.about .history .box {padding-left:145px;}
.about .history .col {display:flex; margin-bottom:24px;}
.about .history .col:last-child {margin-bottom:0;}
.about .history .year {width:100%; max-width:130px; font-size:40px; line-height:1.4em; color:#222; font-weight:700;}
.about .history .txt {width:1%; flex:1 1 auto; padding-top:8px;}
.about .history .txt li {font-size:22px; line-height:1.4em; color:#444; margin-bottom:12px;}
.about .history .txt li:last-child {margin-bottom:0;}
/* sub 02 */
.products-cnt {position:relative; z-index:10;}
.products-cnt .col {display:flex; align-items:center; margin-bottom:140px;}
.products-cnt .img-box {width:100%; max-width:500px; position:relative; z-index:1;}
.products-cnt .img-box .tt {position:absolute; z-index:-1;}
.products-cnt .txt-box {width:1%; flex:1 1 auto;}
.products-cnt .txt-box h5 {font-size:56px; line-height:1.2em; color:#070707; position:relative; display:inline-block; margin-bottom:40px;}
.products-cnt .txt-box h5:after {content:''; width:216px; height:4px; background:#0157d6; position:absolute; bottom:32px; right:0;}
.products-cnt .txt-box p {font-size:32px; font-weight:600; line-height:1.4em; color:#222; margin-bottom:40px;}
.products-cnt .txt-box ul {display:flex; margin:0 -6px; flex-wrap:wrap;}
.products-cnt .txt-box ul li {width:calc(50% - 12px); margin:0 6px 12px; padding-left:34px; font-size:22px; line-height:1.4em; color:#444; position:relative;}
.products-cnt .txt-box ul li:before {content:''; width:5px; height:5px; border-radius:50%; position:absolute; top:12px; left:14px; background:#444;}
.products-cnt .txt-box ul li sup {font-size:16px; line-height:1.1em;}
.products-cnt .ti {margin-bottom:60px;}
.products-cnt .ti h6 {font-size:28px; line-height:1.6em; color:#222; font-weight:600;}
.products .table {display:block; width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch;}
.products .table table {width:100%; border-collapse:collapse; border-spacing:0;border-top:3px solid #0157d6; text-align:center;}
.products .table table col {width:16.666667%;}
.products .table table th {font-size:20px; line-height:1.1em; color:#0157d6; background:rgba(1, 87, 214, 0.03); height:90px; padding:10px; border-right:1px solid #ccc; border-bottom:1px solid #ccc; white-space:nowrap;}
.products .table table th:last-child {border-right:0;}
.products .table table td {font-size:20px; line-height:1.4em; color:#444; height:80px; border-bottom:1px solid #ccc; border-right:1px solid #ccc; padding:10px; white-space:nowrap;}
.products .table table td:last-child {border-right:0;}
.products .table table tr:last-child td {border-bottom-color:#0157d6;}
.products .table table td span {display:block; width:100%; border-top:1px solid #ccc;}
/* sub 02 01 */
.backplane .cnt01 .txt-box h5 {padding-right:260px;}
.backplane .cnt01 .txt-box h5:after {width:216px;}
.backplane .cnt01 .img-box .tt {width:872px; left:-33px; bottom:0;}
.backplane .cnt01 .img {box-shadow:20px 40px 60px rgba(0, 0, 0, 0.25); display:inline-block;}
.backplane .cnt02 {position:relative; z-index:5; padding:366px 0 140px; margin-top:-226px; background:url('../img/sub/backplane02bg.jpg') center center no-repeat;}
.backplane .cnt02 .col {display:flex; flex-wrap:wrap; margin:0 -20px -40px;}
.backplane .cnt02 .row {width:33.3333333%; padding:0 20px; margin-bottom:40px;}
.backplane .cnt02 .inner {padding:40px; background:#fff; display:flex; flex-direction:column; justify-content:space-between; min-height:240px;}
.backplane .cnt02 .inner .tit {display:flex; align-items:flex-end; justify-content:space-between;}
.backplane .cnt02 .inner .tit p {font-size:20px; line-height:1.4em; color:#0157d6;}
.backplane .cnt02 .inner .txt p {font-size:20px; line-height:1.4em; color:#444;}
.backplane .cnt03 {padding:140px 0;}
.backplane .cnt04 {margin-bottom:190px;}
.backplane .cnt04 .col {display:flex; justify-content:center; margin-bottom:140px;}
.backplane .cnt04 .row {padding:0 20px; width:100%; max-width:318px; text-align:center;}
.backplane .cnt04 p {font-size:24px; line-height:1.4em; color:#222; font-weight:700; margin-top:30px;}
/* sub 02 02 */
.driver .cnt01 {margin-bottom:190px;}
.driver .cnt01 .txt-box h5 {padding-right:175px;}
.driver .cnt01 .txt-box h5:after {width:134px;}
.driver .cnt01 .img-box .tt {width:1321px; left:18px; bottom:-80px;}
.driver .cnt02 {margin-bottom:140px;}
.driver .cnt03 {padding:140px 0 374px; background:rgba(246, 246, 246, 0.80); position:relative;}
.driver .cnt03.products-cnt .col {display:block; position:relative; margin-bottom:0;}
.driver .cnt03.products-cnt .txt-box h5 {padding-right:175px;}
.driver .cnt03.products-cnt .txt-box h5:after {width:133px;}
.driver .cnt03.products-cnt .txt-box {width:100%;}
.driver .cnt03.products-cnt .txt-box ul li {width:calc(33.33333% - 12px);}
.driver .cnt03 .tt {position:absolute; top:40%; right:-200px; z-index:-1;}
.driver .cnt04 {position:relative; z-index:11; margin-top:-234px; margin-bottom:-240px;}
.driver .cnt04 h6 {font-size:28px; line-height:1.6em; color:#222; font-weight:600; margin-bottom:60px;}
.driver .cnt05 {padding:380px 0 140px;}
.driver .cnt06 {margin-bottom:140px;}
.driver .cnt06 .col {display:flex; margin:0 -20px;}
.driver .cnt06 .col .row {width:25%; padding:0 20px; text-align:center;}
.driver .cnt06 .col .row p {font-size:24px; line-height:1.4em; font-weight:700; margin-top:30px;}
.driver .cnt07 {margin-bottom:200px;}
.driver .cnt07 h6 {font-size:28px; line-height:1.6em; color:#222; font-weight:600; margin-bottom:60px;}
.driver .cnt07 .img-box {margin-top:140px;}