@charset "UTF-8";

/* 제품소개 */
.product{width: 100%;/* color:#000; */}
.product .sec01{width: 100%;display: table;}
.product .sec01 img{width: 35%;display: inline-block;}
.product .sec01 p{font-size: 37px;font-weight: 300;display: inline-block;width: 58%;word-break: keep-all;margin-left: 7%;letter-spacing: -1px;color: #000;vertical-align: middle;}
.product .sec01 p span{font-weight: 500;}
.product .sec02{margin: 10% 0 5% 0;position:relative;padding: 7% 5%;box-sizing: border-box;border-top:1px solid #ddd;border-bottom:1px solid #ddd;}
.product .sec02 div{box-sizing: border-box;}
.product .sec02 div img{width: 22%;display: inline-block;vertical-align: baseline;}
.product .sec02 div div{width: 67%;display: inline-block;margin-left: 8%;}
.product .sec02 div div p{font-size: 33px;color: #017ac9;font-weight: 700;letter-spacing: 0;padding-bottom: 2%;}
.product .sec02 div div ul li{font-size: 18px;padding: 4px 0;position: relative;padding-left: 18px;line-height: 27px;/* color: #101010; */font-weight: 400;}
.product .sec02 div div ul li:after{content: "";position: absolute;width: 4px;height: 4px;background: #124a6f;top: 17px;left:0;border-radius: 21px;}
.product .sec03{width:100%;margin-top: 100px;display: table;}
.product .sec03 h4{font-size: 24px;font-weight:600;padding-bottom: 1%;color: #101010;}
.product .sec03 p{font-size: 17px;line-height: 30px;font-weight: 300;color: #000;margin-bottom: 5%;}
.product .sec03{width:100%;margin-top: 100px;display: table;}
.product .sec03 img{}
.product .sec03 .flex{width:100%;display: inline-block;}
.product .sec03 .flex div{width:50%;display: table-cell;}
.product .sec03 .flex .img{float: left;width:50%;}
.product .sec03 .flex .txt{float:right;width:50%;padding: 10% 5%;box-sizing: border-box;height: auto;}
.product .sec03 .flex .txt p{font-size: 19px;color: #9d043a;font-weight: 500;}
.product .sec03 .flex .txt span{font-size: 34px;padding-top: 6px;display: block;}
.product .sec03 .flex:nth-child(2n) .img{float: right;}
.product .sec03 .flex:nth-child(2n) .txt{float: left;text-align: right;}
.product .sec04{width:100%;}

/*제품구매*/
.buying h4{font-family: 'Montserrat';font-size: 33px;font-weight: 500;margin-top: 6%;margin-bottom:20px;position: relative;border-bottom: 1px solid #111;color: #000;padding-bottom: 1%;}
.buying h4:first-child{margin-top: 7%;}
.buying ul{font-size:0;}
.buying ul li{display: inline-block;margin-left: 3%;margin-bottom: 3%;width: calc((100% / 3) - 2%);border: 1px solid #f7f7f7;padding: 2%;background: #f7f7f7;box-sizing: border-box;}
.buying ul li:first-child{margin-left:0;}
.buying ul li div.item{margin-bottom: 20px;}
.buying ul li div.item .img_thumbnail{position: relative;padding-top: 65%; /* 1:1 ratio */overflow: hidden;border: 1px solid #eee;background: #fff;}
.buying ul li div.item .img_thumbnail .img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: translate(50%,50%); -ms-transform: translate(50%,50%); transform: translate(50%,50%);  }
.buying ul li div.item .img_thumbnail .img img{transition:.5s;position: absolute; top: 0; left: 0; max-width: 100%; height: auto; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);  }
.buying ul li div.item p{font-family: 'Montserrat';font-size: 26px;font-weight: 500;margin: 9% 0;text-align: center;color: #000;}
.buying ul li a{text-align: center;padding: 11px 25px;background: #fff;color:#fff;position: relative;transition: .2s ease;font-size: 16px;display: block;width: 72px;border: 1px solid #ccc;color: #222;border-radius: 200px;margin:  0 auto;margin-bottom: 7%;}
.buying ul li:hover{border:1px solid #ddd;box-sizing: border-box;}
.buying ul li:hover a{background: #000; color:#fff; border:1px solid #000;}
.buying ul li:hover div.item .img_thumbnail .img img{transform: translate(-50%,-50%) scale(1.05);}

.order{padding:10% 0;}
.order .registration{display: table;}
.order .registration .img_box{display: table-cell;width: 40%;text-align: center;}
.order .registration .img_box img{width: 60%;margin-top:20%;}
.order .registration .order_box{display: table-cell;width: 60%;vertical-align: top;}
.order .registration .input_inform{text-align: left;}
.order .registration .order_box .tit{border-bottom:1px solid #e3e3e3;}
/*.order .registration .order_box .tit label{font-size:16px; font-weight:400; text-align: left;display: block;}*/
.order .registration .order_box .tit span{font-size: 50px;font-weight: 600;padding: 0% 0 2% 0;display: block;}
.order .registration .order_box .opt{padding: 5% 0;}
.order .registration .order_box .opt p{padding-bottom:5px;}
.order .registration .order_box .opt div{display: block;padding: 4% 4%;background:#f8f8f8;width:100%;margin: 1% 0;box-sizing: border-box;}
.order .registration .order_box .opt div:nth-child(4){margin-bottom:0;}
.order .registration .order_box .opt label{font-size:18px;color:#111;padding-left: 35px;font-weight: 500;}
.order .registration .order_box .opt label span{font-size:15px;color:#666;padding: 0 8px 0 0;font-weight: 400;}
.order .registration .order_box .deco_check{margin-left:0;}
.order .registration .order_box .opt{transition:all 0.25s;display: block;position:relative;vertical-align:middle;height:auto;line-height: 24px;border-bottom: 1px solid #111;}
.order .registration .order_box .opt .device{margin:0;background:#fff;border-top:1px solid #eee;padding: 1% 0;}
.order .registration .order_box .opt .device select{width:100%;padding: 2%;font-size: 16px;border: 1px solid #e3e3e3;border-radius: 0;}
.order .registration .order_box .opt .device select:focus, .order .registration .order_box .opt .device select::selection{border:1px solid #aaa; border-radius:0;}
.order .registration .order_box .opt .device select option{font-size: 15px;padding: 5px;border-bottom: 1px solid #eee;}

.order .registration .order_box .cart{padding: 3% 0;width: 100%;border-bottom: 1px solid #e3e3e3;}
.order .registration .order_box .cart .cart_list{display: table;padding: 3% 3%;width: 100%;border-bottom: 1px dashed #ddd;box-sizing: border-box;}
.order .registration .order_box .cart .cart_list:last-child{border-bottom:0;}
.order .registration .order_box .cart .cart_list .cart_tit{display: inline-block;width: 37%;margin-right: 5%;vertical-align: middle;}
.order .registration .order_box .cart .cart_list .cart_tit span{font-size: 15px;color: #555;}
.order .registration .order_box .cart .cart_list .cart_count{display: inline-block;width: 23%;margin-right: 5%;}
.order .registration .order_box .cart .cart_list .cart_count .btn_vol{width: 30px;height: 30px;font-size: 21px;font-weight: 300;border: 1px solid #ddd;line-height: 30px;}
.order .registration .order_box .cart .cart_list .cart_count .vol_up{margin-left:-4px;}
.order .registration .order_box .cart .cart_list .cart_count input{width: 53px;text-align: center;border-radius: 0;border:1px solid #ddd;height: 30px;box-sizing: border-box;margin-left: -4px;}
.order .registration .order_box .cart .cart_list .cart_price{display: inline-block;text-align: right;font-size: 15px;width: 21%;/* margin: 0 5%; */}
.order .registration .order_box .cart .cart_list .cart_price .price{font-size: 14px; }
.order .registration .order_box .cart .cart_list .cart_price .won{margin-left:5px;}
.order .registration .order_box .cart .cart_list .btn_del{background: #ccc;color: #222;padding: 0px 4px;font-size: 10px;text-align: right;margin-left: 5%;}
.order .registration .order_box .total_price{padding:5% 0;text-align: right;}
.order .registration .order_box .total_price span{font-size: 26px;font-weight: 600;margin-left: 20px;}
.order .button_b{margin: 5% 0;text-align: center;}
.order .button_b a{text-align: center;font-size: 18px;display: inline-block;margin: 0 1%;width: 47%;padding: 3% 0;}
.order .button_b .btn_add_cancel{border: 1px solid #ccc; color: #666; }
.order .button_b .btn_add_order{background: #b20e55; color: #fff; }


@media (max-width:1554px){
    /* 제품소개 */
    .product .sec03{margin-top:5%;}
}

/* tablet (768px) ~ 1023px */
@media (max-width: 1024px) {

    /*제품구매*/
    .buying ul li{/margin-left: 2%;}
    .buying h4{margin-top:100px;font-size: 35px;}

    /* 제품소개 */
    .product .sec01 p{font-size: 31px;vertical-align: middle;}
    .product .sec02 div img{ width: 29%;}
    .product .sec02 div div{width: 61%;}
    .product .sec03{width:100%;margin-top: 100px;display: table;}
    .product .sec03 h4{font-size: 24px;font-weight:600;padding-bottom: 1%;color: #101010;}
    .product .sec03 p{font-size: 16px;line-height: 27px;font-weight: 300;color: #000;margin-bottom: 5%;}
    .order .registration .img_box{width:100%; text-align: center;display: block;}
    .order .registration .order_box {width:100%;}
}

/* mobile ~ 767px */
@media  (max-width:767px) {
    /*제품구매*/
    .buying ul li {margin-left: 3%; width: calc((100% / 2) - 2%); margin-bottom: 3%;}
    .buying ul li:nth-child(2n-1){margin-left: 0;}
    .buying h4 {margin-top: 40px;font-size: 28px;}
    .buying h4:first-child{margin-top: 60px;}

    /* 제품소개 */
    .product .sec01 img{display:block;width: 46%;text-align: center;margin: 0 auto;font-size: 17px;}
    .product .sec01 p{display: block;width:100%;text-align: center;margin:0;padding: 5% 10%;box-sizing: border-box;font-size: 25px;}
    .product .sec02{margin: 2% 0;padding: 7% 0;}
    .product .sec02 div img{width: 30%;display: block;margin: 0 auto;}
    .product .sec02 div p{width:100%; display: block;}
    .product .sec02 div div{width: 100%;margin: 0;padding: 7% 5% 0 5%;}
    .product .sec02 div div p{font-size: 29px;}
    .product .sec02 div div ul li{font-size: 16px;line-height: 24px;padding-left: 15px;}
    .product .sec02 div div ul li:after{top: 14px;}
    .product .sec03{margin-top: 8%;}
    .product .sec03 h4{font-size: 22px;}
    .product .sec03 p{font-size: 16px;line-height: 28px;}
    .product .sec04 img{width: 100%;}


}


@media  (max-width:540px) {
    .buying ul li div.item{margin-bottom: 5%;}
    .buying ul li div.item p{font-size: 22px;margin: 8% 0 0 0;font-size: 18px;}
    .buying ul li a{margin-bottom: 7%;font-size: 13px;padding: 7px 3px; }
    .order .registration .order_box .cart .cart_list{padding: 4% 2%;width: 100%;}
    .order .registration .order_box .cart .cart_list .cart_tit{display: block;width: 100%;margin-right: 0;vertical-align: middle;}
    .order .registration .order_box .cart .cart_list .cart_count{display: inline-block;width: 67%;margin-right: 0;margin-top: 14px;}
    .order .registration .order_box .total_price span{font-size:23px;}
    .order .button_b a{font-size:16px;}
}



