/* @import url('/m/parkhyatt/css/font.css'); */
@import url('/m/parkhyatt/css/reset.css');
@import url('/m/parkhyatt/css/common.css');

:root {
    /* color */
    --main-color:#947D4C;
    --sub-color:#2C1B00;
    --dec-color:rgba(148,125,76,10%);    
    --gray-color:#808080;
    --bar-color:#EFEFEF;

    /* font-size */
    --title-ft:30px;
    --subtitle1-ft:19px;
    --subtitle2-ft:17px;
    --des1-ft:14px;
    --des2-ft:13px;
    --des3-ft:12px;

    /* space */
    --section-space: 100px;
}

body{color: #121212; letter-spacing: -0.25px;}
#fix.fix{bottom:80px;}
#fix .menu{bottom: 145px;}
#mainVisual {margin-top: 61px; padding-bottom: 58px;}
#container{position: relative; margin-bottom: 60px;}
#container .inner { width: 90%; margin: 0 auto;}

/* common */
.gray-bar{border: 5px solid #EFEFEF; margin: var(--section-space) 0;}

/* mainVisual */
#mainVisual img{width: 100%;}
#mainVisual .ratesBox {width: calc(100% - 50px); margin: 33px auto; display: flex; align-items: center;}
#mainVisual .ratesBox button{background: #121212; color: #fff; padding: 15px 20px; border: none; font-size: 16px; margin-right: 13px;} 
#mainVisual .ratesBox p{font-size: 16px;}
#mainVisual .ratesBox span{font-size: 20px;}

/* SPECIAL PRICE */
.price{text-align: left; margin-top: 20px;}
.price h4{color: var(--sub-color); font-size: var(--subtitle1-ft); padding-bottom: 7px; font-weight: 700;}
.price .des{font-size: 20px; line-height: 1.45; display: none;}
.price .des span{color: var(--main-color); font-weight: 600;}
.price .course{color: var(--gray-color); line-height: 1.5; font-size: 16px;}

table{ border-collapse : collapse; width: 100%; margin-top: 30px;}
table th,td{width: 60px; height: 60px; text-align: left; vertical-align: middle;}
table th {border-bottom: 2px solid; font-size: 15px; padding-left: 8px; font-weight: 500; height: 25px; font-weight: 400;}
table td {border: 1px solid #DCDCDC; font-weight: 600; color: var(--sub-color); font-size: var(--des-ft); padding-left: 8px; letter-spacing: -0.5px;}
table tr td:first-child{background: var(--dec-color); color: inherit; font-size: 15px; border-left: 0; font-weight: 500; letter-spacing: inherit; font-weight: 400;}
table tr td:last-child{border-right: 0;}

table td p.line{color: var(--gray-color); font-size: 12px; text-decoration-line: line-through; font-weight: 400; padding-bottom: 6px;}
table td > div{display: flex; padding-bottom: 3px; font-size: 16px;}
table td > div p.disc{color: #a10000; padding-right: 5px; font-weight: 700;}
table td > div p.won{font-weight: 700;}

/* gotchaExclusive */
.gotchaExclusive{display: none; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); position: fixed; top: 0; left: 0; z-index: 999999;}
.gotchaExclusiveBox{background: url('../img/service_intro/exBg.png')no-repeat; background-size: cover; position: absolute; bottom: 60px; width: 100%;}
.gotchaExclusiveBox .inner{width: 90%; margin: 0 auto;}
.gotchaExclusive .title{display: flex; align-items: center; padding: 50px 0;}
.gotchaExclusive .title img{height: 48px;}
.gotchaExclusive .title img.text{height: 32px; margin-left: 8px;}
.gotchaExclusive .text h3{font-size: var(--subtitle1-ft); line-height: 1.3; margin: 30px 0 20px; padding-top: 60px;}
.gotchaExclusive .aptImg{height: 160px;}
.gotchaExclusive .close{position: absolute; top: 20px; right: 12px; padding: 20px; z-index: 1;}
.gotchaExclusive .close img{height: 20px;}
.gotchaExclusive .btnWrap button, .btnWrap button{border: none; background: #121212; width: 100%;height: 60px; font-family: 'Noto Sans KR', sans-serif; font-size: var(--des-ft);color: #fff; font-weight: 400;}
.gotchaExclusive form{margin: 30px 0 60px 0;}
.gotchaExclusive form select{border: none; border-bottom: 2px solid var(--main-color); padding: 20px 35px 20px 0; font-size: var(--subtitle2-ft); color: var(--main-color); font-weight: 600; background: url(../img/service_intro/iconSelect.png) no-repeat center right 10px/ 12px; outline: none; width: 100%;}
.gotchaExclusive form p{margin-top: 25px;}
.gotchaExclusive form p{font-size: var(--subtitle2-ft); font-weight: 600;}
.gotchaExclusive .text p.gray{color: var(--gray-color); font-size: var(--des-ft); line-height: 1.5;}
.gotchaExclusive .text p.gray span{font-weight: 600;}

/* apply */
.btnWrap{position: fixed; bottom: 0; left: 0; width: 100%;}

/* 모달 스타일 */
.modal {display: none; position: fixed; z-index: 100; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.7);}  
.modal-content {position: relative; background-color: #fff; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 20px; width: 80%; overflow: hidden;}
.swiper-container{overflow: hidden;}
.closemodal{position: absolute; top: 0; right: 0; z-index: 10; padding: 20px;}
.closemodal img{height: 20px;}
.swiper-slide {font-size: 18px; background-color: #fff; padding: 40px 0 40px 0;}
span.swiper-pagination-bullet.swiper-pagination-bullet-active{width: 20px; border-radius: 20px; background: #121212;}
.swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal{bottom: 26px;}

/* Media Query */
@media (max-width: 380px) {
    table td > div{font-size: 14px;}
    table td p.line{font-size: 12px;}
    table tr td:first-child{font-size: 14px;}
}