.option_wrapper {}
.option_wrapper .contents {}
.option_wrapper .sub_navi {padding: 60px 0 50px;}
.option_wrapper .sub_navi ul li {display: inline-block; vertical-align: middle;}
.option_wrapper .sub_navi ul li.divider span {display: inline-block; width: 6px; height: 6px; position: relative; transform: rotate(135deg); margin-left: 6px; margin: 0 20px 0 12px;} 
.option_wrapper .sub_navi ul li.divider span::before {content: ''; position: absolute; width: 100%; height: 100%; border: 1px solid #d7d7d7; border-right: 0; border-bottom: 0;}
.option_wrapper .sub_navi ul li.divider span::after {content: ''; position: absolute; height: 1px; background: #d7d7d7; transform-origin: 0 100%; transform: rotate(45deg);}
.option_wrapper .sub_navi ul li .home {display: inline-block; background: url('../images/navi_home.png') no-repeat center; width: 17px; height: 16px;}
.option_wrapper .sub_navi ul li .current {font-weight: 500; color:#f69232;}


.option_wrapper .sec1 {padding-bottom: 220px;}
.option_wrapper .sec1 .top_info {width: 50%; display: inline-block; float: left;}
.option_wrapper .sec1 .top_info.main_img {margin-top: 50px;}
.option_wrapper .sec1 .top_info.top_txt {padding-left: 140px; width: calc(50% - 140px);}
.option_wrapper .sec1 .top_info.top_txt .title {border-bottom: 1px solid #eee; margin-bottom: 35px;}
.option_wrapper .sec1 .top_info.top_txt .title h3 {color:#f69232;}
.option_wrapper .sec1 .top_info.top_txt .title h2 {padding: 30px 0 5px;}
.option_wrapper .sec1 .top_info.top_txt .title h3.full_name {color:#888; font-weight: 400; margin-bottom: 30px;}
.option_wrapper .sec1 .top_info.top_txt .text {}
.option_wrapper .sec1 .top_info.top_txt .text h3 {color:#f69232; margin-bottom: 20px;}
.option_wrapper .sec1 .top_info.top_txt .text h4 {margin-bottom: 55px;}
.option_wrapper .sec1 .top_info.top_txt .button {    text-transform: unset;background-color: #f69232; font-size: 1.8rem; font-weight: 400; color:#fff; height: 60px; line-height: 60px; padding: 0 40px; border-radius: 50px; display: inline-block; text-align: center; box-sizing: border-box;}
.option_wrapper .sec1 .top_info.top_txt .button:hover {background-color:#333;}
.option_wrapper .sec1 .top_info.top_txt .button.line {background: none; border: 1px solid #f69232; color:#f69232; margin-left: 18px;}
.option_wrapper .sec1 .top_info.top_txt .button.line:hover {border: 1px solid #333; color:#333;}
.option_wrapper .sec1 .top_info.top_txt .en_btn {}
.option_wrapper .sec1 .top_info.top_txt .en_btn .button {width: 100%;}
.option_wrapper .sec1 .top_info.top_txt .en_btn .button.line {margin-top: 12px; margin-left: 0;}


.option_wrapper .sec2 {padding-bottom: 100px;}
.option_wrapper .sec2 .description_wrap {width: 50%; float: left; }
.option_wrapper .sec2 .description_wrap .infographic {display: inline-block; padding: 0 20px; margin-right: 60px; vertical-align: middle;}
.option_wrapper .sec2 .description_wrap .infographic.ic_1 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic1.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_2 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic2.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_3 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic3.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_4 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic4.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_5 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic5.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_6 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic6.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_7 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic7.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_8 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic8.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_9 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic9.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_10 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic10.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_11 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic11.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_12 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic12.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_13 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic13.png') no-repeat center / cover;}
.option_wrapper .sec2 .description_wrap .infographic.ic_14 span {display: inline-block; width: 110px; height: 138px; background: url('../images/info_ic14.png') no-repeat center / cover;}

.option_wrapper .sec2 .description_wrap .description {display: inline-block; padding-right: 50px; width: calc(100% - 270px); vertical-align: middle;}
.option_wrapper .sec2 .description_wrap .description h3 {font-weight: 700; margin-bottom: 16px;}



.option_wrapper .sec3 {padding-bottom: 120px;}
.option_wrapper .sec3 h3 {color:#f69232; margin-bottom: 35px;}
.option_wrapper .sec3 .spec_wrap {display: flex; flex: 1 1 40%; flex-flow: row wrap;}
.option_wrapper .sec3 .spec_wrap ul {display: inline-block; border-top: 2px solid #666; border-bottom: 2px solid #dedede; width: calc(50% - 22px); margin-right: 20px; margin-bottom: 20px; display: flex; justify-content: space-between;}
.option_wrapper .sec3 .spec_wrap ul:nth-child(even) {margin-right: 0; margin-left: 20px;}
.option_wrapper .sec3 .spec_wrap ul li {display: inline-block; padding: 30px 10px;}
.option_wrapper .sec3 .spec_wrap ul li:first-child h4 {font-weight: 700; color:#444;}
.option_wrapper .sec3 .spec_wrap ul li:last-child {text-align: right;}
.option_wrapper .sec3 .spec_wrap ul li h4 {display: inline-block;}
.option_wrapper .sec3 p {color:#cf2e2e; font-weight: 500; margin-top: 6px;}


.option_wrapper .discover_wrap {background-color: #f9f9f9; padding: 120px 0;}
.option_wrapper .sec4 {overflow: visible;}
.option_wrapper .sec4 .left_txt {width: calc(33% - 50px); margin-right: 50px; display: inline-block; float: left; margin-top: 35px;}
.option_wrapper .sec4 .left_txt h1 span {color:#f69232;}
.option_wrapper .sec4 .left_txt h3 {padding: 42px 0 28px;}
.option_wrapper .sec4 .left_txt h3 span {color:#f69232;}
.option_wrapper .sec4 .left_txt p {color:#888;}

.option_wrapper .sec4 .product_wrap {width: 67%; display: flex; overflow: hidden;}
.option_wrapper .sec4 .product_wrap .next {width: 100px; height: 100px; line-height: 104px; border-radius: 50%; background-color: #f69232; text-align: center; position: absolute; box-shadow: 5px 5px 10px rgb(239 119 4 / 20%); top: calc(50% - 90px); right: -50px;  z-index: 1; transition: all 0.5s ease-in-out; cursor: pointer;}
.option_wrapper .sec4 .product_wrap .next:hover {transform: translate(-15px,0);}
.option_wrapper .sec4 .product_wrap .next span {width: 10px; height: 10px; position: relative; margin-bottom: 30px; transform: rotate(135deg); left: 6px; display: inline-block; top:27%;}
.option_wrapper .sec4 .product_wrap .next span::before {content: ''; position: absolute; width: 100%; height: 100%; border: 4px solid #fff; border-right: 0; border-bottom: 0; border-radius: 3px;}
.option_wrapper .sec4 .product_wrap .next span::after {content: ''; position: absolute; height: 4px; background: #fff; transform-origin: 0 100%; transform: rotate(45deg);}


.option_wrapper .sec4 .product_wrap .box_wrap {display: flex; flex-shrink:0;}
.option_wrapper .sec4 .product_wrap .box {width: 50%; display: inline-block;}
.option_wrapper .sec4 .product_wrap .box .box_img {position: relative;  padding-top: 100%;}
.option_wrapper .sec4 .product_wrap .box .box_img  img {position: absolute;  top: 0; left: 0; }
.option_wrapper .sec4 .product_wrap .box:hover .box_img {background-color: #111;}
.option_wrapper .sec4 .product_wrap .box:hover .box_img img {transition: all .3s ease; opacity: 0.2;}
.option_wrapper .sec4 .product_wrap .box:hover .box_img .more_btn {opacity: 1; transition: all 1.5s ease;}
.option_wrapper .sec4 .product_wrap .box .box_img .more_btn  {width: 100px; height: 100px; border-radius: 50%; border: 8px solid rgb(255 255 255 / 10%); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; opacity: 0;}
.option_wrapper .sec4 .product_wrap .box .box_img .more_btn .inner {width: 100px; height: 100px; background-color: #fff; border-radius: 50%; margin: 0;}
.option_wrapper .sec4 .product_wrap .box .box_img .more_btn .inner span {display: inline-block; background: #f69232; height: 19px; position: relative; width: 3px; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 5px;}
.option_wrapper .sec4 .product_wrap .box .box_img .more_btn .inner span::after {content: ""; background: #f69232; height: 3px; position: absolute; top: 8px; left: -8px; width: 19px; border-radius: 5px;}
.option_wrapper .sec4 .product_wrap .box .box_txt {margin-top: 22px; display: flex;}
.option_wrapper .sec4 .product_wrap .box .box_txt h4 {color:#444; font-weight: 500; display: inline-block; line-height: 3.0rem; width: 50%;}
.option_wrapper .sec4 .product_wrap .box .box_txt h4 .bullet {width: 3px; height: 18px; background-color: #f69232; display: inline-block; margin-top: 4px; float: left;}
.option_wrapper .sec4 .product_wrap .box .box_txt h4 span {margin-left: 10px; overflow: hidden; float: left; width: calc(100% - 13px);}
.option_wrapper .sec4 .product_wrap .box .box_txt p {display: inline-block; color:#888; margin-top: 3px; text-align: right; width: 50%; line-height: 24px;}






@media only screen and (min-width: 1200px) and (max-width: 1440px) {
    .option_wrapper .sec1 .top_info.top_txt {padding-left: 100px; width: calc(50% - 100px);}
    .option_wrapper .sec4 .product_wrap {width: 64%;}
    .option_wrapper .sec4 .product_wrap .next {right: -10px;}

}

@media (max-width: 1550px) {
    .option_wrapper .sec4 .product_wrap {width: 64%;}
    .option_wrapper .sec4 .product_wrap .next {right: -10px;}
}

@media only screen and (min-width: 960px) and (max-width: 1199px) {
    .option_wrapper .sec1 {padding-bottom: 160px;}
    .option_wrapper .sec2 .description_wrap .infographic {padding: 0;}
    .option_wrapper .sec2 .description_wrap .description {width: calc(100% - 160px);}
    .option_wrapper .sec1 .top_info.top_txt {padding-left: 70px; width: calc(50% - 70px);}
    .option_wrapper .sec1 .top_info.top_txt .button {padding: 0 30px;}
    .option_wrapper .sec1 .top_info.top_txt .button.line {margin-left: 10px;}
    .option_wrapper .sec1 .top_info.top_txt .text h4 {margin-bottom: 40px;}
    .option_wrapper .sec2 .description_wrap .infographic {margin-right: 20px;}
    .option_wrapper .sec2 .description_wrap .description {padding-right: 0px; width: calc(100% - 220px);}

    .option_wrapper .sec1 .top_info.top_txt .en_btn .button {width: 100%;}
}


@media (max-width: 959px) {
    .option_wrapper .sec1 {padding-bottom: 160px;}
    .option_wrapper .sec1 .top_info.main_img {width: 70%; position: relative; left: 50%; transform: translateX(-50%);}
    .option_wrapper .sec1 .top_info.top_txt {padding-left: 0; width: 100%;}
    .option_wrapper .sec1 .top_info.main_img {margin-top: 0;}
    .option_wrapper .sec2 .description_wrap .infographic {margin-right: 20px; }
    .option_wrapper .sec2 .description_wrap {width: 100%; float: none; margin-bottom: 40px;}
    .option_wrapper .sec2 .description_wrap .description {padding-right: 0px; width: calc(100% - 220px);}
    .option_wrapper .sec2 .description_wrap .infographic.ic_1 span {background: url('../images/info_ic1_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_2 span {background: url('../images/info_ic2_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_3 span {background: url('../images/info_ic3_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_4 span {background: url('../images/info_ic4_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_5 span {background: url('../images/info_ic5_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_6 span {background: url('../images/info_ic6_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_7 span {background: url('../images/info_ic7_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_8 span {background: url('../images/info_ic8_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_9 span {background: url('../images/info_ic9_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_10 span {background: url('../images/info_ic10_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_11 span {background: url('../images/info_ic11_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_12 span {background: url('../images/info_ic12_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_13 span {background: url('../images/info_ic13_x3.png') no-repeat center / cover;}
    .option_wrapper .sec2 .description_wrap .infographic.ic_14 span {background: url('../images/info_ic14_x3.png') no-repeat center / cover;}
    .option_wrapper .sec4 .left_txt {width: 100%; margin-bottom: 40px; margin-top: 0;}
    .option_wrapper .sec4 .product_wrap {width: 95%;}
    .option_wrapper .sec4 .left_txt h3 {padding: 30px 0 10px;}
    .option_wrapper .sec4 .product_wrap .next {width: 80px; height: 80px; top: auto; bottom: 32%; right: 0px;}
    .option_wrapper .sec4 .product_wrap .next span {left: 4px; top: calc(50% - 23px);}
    .option_wrapper .sec4 .product_wrap .next span::before {border: 3px solid #fff; border-right: 0; border-bottom: 0;}
    .option_wrapper .sec4 .product_wrap .next span::after {height: 4px;}
    .option_wrapper .sec4 .product_wrap .box .box_img .more_btn {width: 80px; height: 80px; border: 5px solid rgb(255 255 255 / 10%);}
    .option_wrapper .sec4 .product_wrap .box .box_img .more_btn .inner {width: 80px; height: 80px;}
    .option_wrapper .sec4 .product_wrap .next:hover {transform: translate(0,0);}
}



@media (max-width: 767px) {
    .option_wrapper .sec1 {padding-bottom: 120px;}
    .option_wrapper .sec1 .top_info.main_img {width: 100%;}
    .option_wrapper .sec1 .top_info.top_txt {padding-left: 0; width: 100%;}
    .option_wrapper .sec2 {padding-bottom: 80px;}
    .option_wrapper .sec2 .description_wrap .infographic {padding: 0;}
    .option_wrapper .sec2 .description_wrap .description {width: calc(100% - 140px);}
    .option_wrapper .sec3 {padding-bottom: 100px; }
    .option_wrapper .sec3 .spec_wrap ul {width: 100%; margin-right: 0;}
    .option_wrapper .sec3 .spec_wrap ul:nth-child(even) {margin-left: 0;}

    .option_wrapper .sec4 .product_wrap .next {width: 60px; height: 60px; top: auto; bottom: calc(39% - 30px); right: 0px;}
    .option_wrapper .sec4 .product_wrap .next span {left: 4px; top: calc(50% - 23px);}
    .option_wrapper .sec4 .product_wrap .next span::before {border: 3px solid #fff; border-right: 0; border-bottom: 0;}
    .option_wrapper .sec4 .product_wrap .next span::after {height: 4px;}
    .option_wrapper .sec4 .product_wrap .box .box_img .more_btn {width: 60px; height: 60px; border: 5px solid rgb(255 255 255 / 10%);}
    .option_wrapper .sec4 .product_wrap .box .box_img .more_btn .inner {width: 60px; height: 60px;}
    .option_wrapper .sec4 .product_wrap .box .box_txt {flex-direction: column;}
    .option_wrapper .sec4 .product_wrap .box .box_txt h4 {width: 100%;}
    .option_wrapper .sec4 .product_wrap .box .box_txt p {width: 100%; text-align: left; margin-left: 13px;}
    .option_wrapper .discover_wrap {padding: 100px 0;}
    .option_wrapper .sub_navi ul li.divider span {margin: 0 14px 0 6px}

    .option_wrapper .sec1 .top_info.top_txt .en_btn .button {width: 100%;}
}



@media only screen and (min-width: 480px) and (max-width: 580px) {
    .option_wrapper .sec4 .product_wrap .next {bottom: calc(38% - 30px);}
}


@media (max-width: 479px) {
    .option_wrapper .sec1 .top_info.top_txt .button {width: calc(50% - 6px); padding: 0 10px;}
    .option_wrapper .sec1 .top_info.top_txt .button.line {margin-left: 10px;}

    .option_wrapper .sec4 .product_wrap .next {bottom: calc(36% - 30px);}
    .option_wrapper .sec4 .product_wrap .box .box_txt {margin-top: 14px;}
    .option_wrapper .sec4 .product_wrap .box .box_txt p {line-height: 20px; font-size: 14px;}
    
    .option_wrapper .sec2 .description_wrap .infographic span {width: 66px !important; height: 82.8px !important;}
    .option_wrapper .sec2 .description_wrap .description {width: calc(100% - 90px);}
    .option_wrapper .sec2 .description_wrap .description h3 {margin-bottom: 6px;}

    


    
}


@media only screen and (min-width: 376px) and (max-width: 420px) {
    .option_wrapper .sec4 .product_wrap .next {width: 50px; height: 50px; bottom: calc(35% - 30px);}
}


@media (max-width: 375px) {
    .option_wrapper .sec3 .spec_wrap ul {padding: 12px 0; flex-direction: column;}
    .option_wrapper .sec3 .spec_wrap ul li {display: block; padding: 2px 10px;}
    .option_wrapper .sec3 .spec_wrap ul li:last-child {text-align: left;}

    .option_wrapper .sec4 .product_wrap .next {width: 40px; height: 40px; bottom: 29%;}
    .option_wrapper .sec1 .top_info.top_txt .button {width: 100%;}
    .option_wrapper .sec1 .top_info.top_txt .button.line {margin-left: 0; margin-top: 10px;}
    .option_wrapper .sub_navi ul li:last-child {width: calc(100% - 120px);}
    .option_wrapper .sub_navi ul li .current {line-height: 18px;}
    

}