/* COMMON */
.contents { padding-top: 40px; }
.contents.board-contents {padding-top:140px;}
.sub-visual-container{
    overflow: hidden; padding: 60px 0; height: 470px; background-repeat: no-repeat; background-position: center;
    -webkit-animation: visualFadeIn .4s ease-in-out .1s forwards; animation: visualFadeIn .4s ease-in-out .1s forwards; opacity: 0;
}
.sub-visual-wrapper{
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-align: center; -ms-flex-align: center; align-items: center;
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
    height: 100%;
}
.sub-visual-container .title { z-index: 2; position: relative; line-height: 1; text-align: center; font-size: 50px; font-weight: 600; color: #ffffff; letter-spacing: -0.04em; }
.sub-visual-container .title small { display: block; margin-bottom: 15px; font-size: 14px; color: #bcc5df; font-weight: 300; letter-spacing: 0.2em; }
.sv1 { background: url('/child/img/sub/sv1.jpg') no-repeat center / cover; }
.sv2 { background: url('/child/img/visual/v2.jpg') no-repeat center / cover; }
@-webkit-keyframes visualFadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes visualFadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@media (max-width: 1024px){
    .sub-visual-container { padding: 0 0 45px; height: 350px; }
    .sub-visual-container .title { font-size: 34px; }
    .sub-visual-container .title small { font-size: 13px; }
}
@media (max-width: 768px){
    .contents { padding-top: 30px; }
    .sub-visual-container { padding: 0; height: 180px; }
    .sub-visual-container .title { font-size: 24px; }
    .sub-visual-container .title small { margin-bottom: 10px; font-size: 11px; }
}



/* Sub Tab List */
.sub-tab-container { z-index: 2; position: relative;/* margin-top: -60px; */}
.sub-tab-lists { display: flex; flex-wrap: wrap; margin: auto; max-width: 1200px; width: 100%; /*background: rgba(0,0,0,.5); */ align-items: center; text-align:center;}
.sub-tab-lists li { flex: 1 1;}
.sub-tab-lists .link{
    display: flex; align-items: center; justify-content: center; position: relative; padding: 4px; height: 60px;
    line-height: 1.4; text-align: center; font-size: 1.6rem; color:#8c8c8c; font-weight: 700;
    background-color: transparent; border:1px solid #cdcdcd; border-collapse: collapse;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s; overflow: hidden;
}
.sub-tab-lists .link::before{
    content: ''; position: absolute; bottom: 0; left: 0;
    width: 100%; height: 100%; background: #ffffff;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
    -webkit-transform-origin: bottom; transform-origin: bottom;
    -webkit-transform: scaleY(0); transform: scaleY(0);
}
.sub-tab-lists .link span { display: block; z-index: 2; position: relative; }
.sub-tab-lists .link--on { color:#191919; font-weight: 700; border-color:#191919; }
.sub-tab-lists .link--on::before{
    -webkit-transform: scaleY(1); transform: scaleY(1);
}
@media(min-width:1201px){
	.sub-tab-lists .link:not(.link--on):hover::before{
        -webkit-transform: scaleY(0.1); transform: scaleY(0.1);
    }
}
@media (max-width:1200px){
    /* .sub-tab-container { margin-top: -50px; } */
    .sub-tab-lists .link { height: 50px; font-size: 1.6rem; }
}
@media (max-width:768px){
    /* .sub-tab-container { margin-top: 0; } */
    /* .sub-tab-lists { background: rgba(0,0,0,.9); } */
    .sub-tab-lists .link { padding: 12px 10px; line-height: 1.3; font-size: 1.4rem; }

    .sub-tab-lists.two-tab-list li { flex: 1 50%;}
}


@media (max-width:1024px){

}
@media (max-width:768px){

}

@media (max-width:500px){

    .sub-tab-lists li {flex:1 1;}

}

/*common*/
.product--section {padding-top:80px;}
.sub-line {display:block; width:100%; height:20px;}
.sub-line span {display:block; width:100%; height:100%; background:url('/child/img/icon/patten.svg') no-repeat center / auto 100%; transition:all 0.3s ease; background-size:cover;}

.search-box {max-width:1200px; width:100%; height:60px; margin:60px auto 80px; background-color:#f0f0f0; position: relative;}
.search-box input[type="text"] {width:100%; height:100%; background-color:transparent !important; border:none !important; padding:0px 20px;}
.search-box .btn-search {background:url("/child/img/sub/search_btn.png") no-repeat; width:17px; height:17px; position: absolute; right:20px; top:50%; transform: translateY(-50%);}

.tit-box {display: flex; max-width:1200px; width:100%; margin:auto;; justify-content: space-between; align-items: center; padding-bottom:40px;}
.tit-box .tit {font-size:4.6rem; font-weight: 700; color:#1b60a8;}
.tit-box .btn-guide {padding:12px 20px; background-color:#1b60a8; color:#fff; font-size:1.6rem; font-weight:700;}
.tit-box .tit.tit-align-center {justify-content: center;}
.tit {font-size:4.6rem; font-weight: 700; color:#1b60a8;}
.tit.tit-align-center {text-align: center; padding-bottom:40px;}

.sel-guide {display: flex; justify-content: flex-end; padding-bottom:30px;}
.quick-form:last-child {margin-left:10px;}
.btn-sel {width:300px; padding:12px 20px; background-color: #1b60a8; color:#fff; font-size:1.6rem; font-weight:700; transition:all 0.3s ease; letter-spacing:-0.02em;}
//  background-color:#d7d7d7;
// color: #222;

.sel-img.sel-img--pc {display: block;}
.sel-img.sel-img--m {display: none;}

@media(min-width:1201px){

    .btn-sel:hover {background-color:#1b60a8; color:#fff;}

}

@media(max-width:1200px){


}

@media(max-width:1024px){


}

@media(max-width:768px){

    .tit-box {padding-bottom:50px;}
    .tit-box .tit {font-size:3.8rem;}
    .tit-box .btn-guide {font-size:1.4rem; padding:10px 20px;}

    .btn-sel {width:100%; font-size:1.4rem; padding:10px 10px;}
    .sel-guide {padding-bottom:20px;}
    .sel-guide > div {flex:1 1;}

    .sel-img.sel-img--m {display: block;;}
    .sel-img.sel-img--pc {display: none;}

}

@media(max-width:520px){

    .tit-box {flex-wrap: wrap;}

    .tit-box .tit {font-size:2.9rem; width:100%; margin-bottom:15px;}

    .btn-sel {font-size:1.3rem;}
}

@media(max-width:480px){



}


.hide {display:none;}
.show {display: block;}

.select {

    position: relative;
    width:100%;
    border-bottom: 1px solid #cdcdcd; cursor:pointer;
    /*background:url('/child/img/sub/select_btn.png') no-repeat right;*/
    /*background-position:right 20px top 24px;*/
    font-weight:700; text-align: center;


}

.select.select-img {

    background:url('/child/img/sub/select_btn.png') no-repeat right;
    background-position:right 20px top 24px;

}

.select .main-select {display: flex; justify-content:space-between;}
.select .select-arrow {background:url('/child/img/sub/select_btn.png') no-repeat center;}

.select span {display:block; font-size:1.6rem; line-height:1; padding:20px; color:#888; line-height:1.6;}

.selected-option {width:100%;}

.select ul {

    position:absolute; top:59px; left:0; width:100%; padding:10px 20px;
    cursor:pointer; border:1px solid #e1e1e1; background-color: #fff;

}

.select ul li {padding:10px 0px;}

.sel-content-box {padding-top:30px; max-width:1200px; width:100%;}

.sel-content-box .sel-content {display:none;}
.sel-content-box .sel-content:first-child {display:block;}

.form-tit {width:100%; text-align: center; border:1px solid #cdcdcd; padding:20px; font-size:1.8rem; font-weight:700; color:#888888; margin:20px 0px;}

.table-box {word-break:break-all;}
.table-box table { text-align: center; width:100%; border-collapse: collapse; table-layout: fixed;}
/* .table-box tr {display: flex;} */
.table-box th, .table-box td {flex:1 1; padding:20px 10px;}
.table-box th {background-color:#d7d7d7; font-size:2rem; color:#444; font-weight:400;}
.table-box td {color:#555; font-size:2rem; font-weight:400; border-bottom:1px solid #cdcdcd; border-right:1px solid #e1e1e1;}
.table-box td:first-child {border-left: 1px solid #cdcdcd;}
// font-size:1.6rem;
.guide-content h5 {font-size:1.8rem; color:#1b60a8; font-weight:700; padding-bottom:20px;}

.guide-form { font-size:1.6rem; color:#888; display: table; table-layout: fixed; width:100%;}
.guide-form:first-child {padding-bottom: 60px;}
/* .guide-form:last-child{padding-top:60px;} */
.guide-form dl {display: flex; flex-wrap: wrap; font-size:1.6rem; color:#888; line-height:1.75; align-items: center;}
.guide-form dt {flex:1 1 20%; padding:15px 20px; background-color:#f0f0f0; border:1px solid #f0f0f0;}
.guide-form dd {flex:1 1 30%; padding:15px 20px; border-top:1px solid #f0f0f0; vertical-align:middle;}
.guide-form dd:last-child {flex:1 1 100%; border-bottom:1px solid #f0f0f0;}

.guide-form dd span,.guide-form dd strong {display: block;}
.guide-form dd span {margin:5px 0px;}
.guide-form dd strong {margin-bottom:10px; color:#222;}
.guide-form dd li {margin-bottom:5px;}
.guide-form dd li:last-child {margin-bottom:0px;}

.guide-form .color-b {font-size:2rem; color:#1b60a8; margin-bottom:10px;}

/* .guide-box {margin-top:40px; height:520px; overflow-y:scroll;} */
.guide-box .quick-txt {display:flex; padding:0px 10px;}
.guide-box .quick-txt::before {content:""; width:1px; border:1px dashed #dcdcdc;}
.guide-box .quick-txt p {padding:20px 20px 40px; font-size:1.6rem; font-weight:400; color:#888; position: relative;}
.guide-box .quick-txt p::before {content: ""; background:url('/child/img/sub/quick_arrow.png') no-repeat center; width:8px; height:5px; display:block; position: absolute; top:30px; left:-5px;}
.guide-box .guide-num {font-size:1.4rem; font-weight:700; color:#fff; display:block; width:100px; padding:10px 15px; background-color:#1b60a8;}

.guide-tit {font-size:1.8rem; color:#1b60a8; font-weight:bold;}
.guide-sub {font-size:1.6rem; color:#222; font-weight:400; padding-top:10px;}
.guide-img {display:block; padding-bottom: 40px;}
.guide-box .error-form > li {padding-bottom:40px;}
.guide-box .error-form > li:last-child {padding-bottom:0px;}
.guide-box .error-list li{display: flex; color:#888; padding:5px 0px; font-size:1.6rem; color:#888;}
.guide-box .error-num {font-size:1.4rem; font-weight:700; color:#fff; display:block; width:22px; height:22px; line-height:22px; padding:0px 6px;text-align: center; background-color:#222; margin-right:10px;}
.guide-box .error-sub {font-size: 1.6rem; color:#888; padding:5px 0px;}

.quick-guide:last-child {margin-left:10px;}

.one-indent {padding-left:10px;}
.two-indent {padding-left:25px;}
.three-indent {padding-left:35px;}

@media (max-width:1200px){

    .sub-line {height: auto;}
    .sub-line span {background-size:auto 13px; height:13px;}

}

@media (max-width:1024px){

}

@media (max-width:768px){

    .sel-content-box {padding-top:20px;}

    .table-box th, .table-box td {font-size:1.4rem;}

    .table-box th, .table-box td {padding: 15px 10px;}

    .sub-line span {background-size:auto 10px; height:10px;}

    .select span {font-size:1.4rem}

    .form-tit {font-size:1.5rem; padding:15px 0px;}

    .guide-content h5 {}

    .guide-form dt {flex:1 30%;}
    .guide-form dd {flex:1 70%;}

    /* .guide-form:last-child {padding-top:50px;} */

    /* .guide-box .quick-txt p {font-size:1.4rem;} */


}

@media (max-width:480px) {

    .table-box th {font-size:1rem;}
    .table-box td {font-size:1.3rem;}
    /* .select {background-position:right 20px top 40px; } */
    .select span:first-child {max-width:320px; width:100%; margin:auto; padding:15px;}

    .guide-content h5 {font-size:1.6rem;}

    .guide-form dt {flex:1 100%; font-size:1.4rem; padding:15px;}
    .guide-form dd {flex:1 100%; font-size:1.4rem; padding:15px;}

    .guide-form:last-child {padding-top:40px;}

    .guide-box .quick-txt p {font-size:1.4rem; padding:20px 20px 20px;}

    .guide-tit {font-size:1.6rem;}
    .guide-box .error-sub {font-size:1.4rem;}
    .guide-sub {font-size:1.4rem;}
    .guide-box .error-form > li {padding-bottom:30px;}
    .guide-box .error-list li {font-size:1.4rem;}

    .guide-box .error-num {width:18px; height:18px; line-height:18px; font-size:1.2rem; margin-right:6px;}

}

/*search-container*/
.search-container {padding-top:80px !important;}
.search-container h3 {font-size:3rem; color:#222; padding-bottom:20px; line-height:1;}
.search-container ul {border-top:1px solid #222;}
.search-container li {padding:20px 10px 20px 0px;  border-bottom:1px solid #e1e1e1; cursor: pointer;}

.search-in-box { margin-top:80px;}
.search-in-box:first-child {margin-top:0px;}

.search-result a {display:block; display: flex; justify-content:space-between; align-items: center;}
.search-result a span {font-size:1.6rem; color:#999; transition:all 0.3s ease;}
.search_more {background:url("/child/img/icon/search_more.png") no-repeat center; width:9px; height:14px; transition:all 0.3s ease;}


/*no search-container*/
.search-in-box.no-search-box {padding:120px 0px;}
.no-search-tit {text-align: center;}
.no-search-tit::before {content:''; background:url('/child/img/icon/no_search.png') no-repeat center; width:100px; height:100px; display: block; margin:0 auto 30px;}
.no-search-txt {font-size:1.6rem; color:#666; text-align: center;}

@media (min-width:1201px){

    .search-result a:hover span {color:#222;}
    .search-result a:hover .search_more {background:url("/child/img/icon/search_on_more.png") no-repeat center; width:9px; height:14px;}

}
