/* header */
.header .header-wrapper{ border-bottom: 1px solid rgba(74,74,72,.3);}
.header .logo-wrap img.logo-normal{display: none;}
.header .logo-wrap img.logo-scroll{display: inline-block;}
.header + .header-btn{ top: 0; opacity: 1; pointer-events: inherit;}
.header + .header-btn.active{top: 120px;}
.header {position: fixed; border-bottom: unset; transition: tranform 0.3s;  top: 0;}
.header:after{height: 100%; background-color: rgba(255,255,255,1); transform: scaleY(1); z-index: -1;}
.header .menu-icon__line{ background-color: #4A4A48;}
.header .header-icon > a.reser-btn{ display: inline-block; border: 1px solid rgba(112,112,112,.5); color: #707070; }
.header .header-icon > a i{ color: #707070;}
body.nav-active .header .header-wrapper{ border-bottom: 1px solid rgba(255,255,255,.3);}
body.nav-active .header:after{height: 100%; background-color: rgba(112,112,112,1); transform: scaleY(1); z-index: -1;}
body.nav-active .header .logo-wrap img.logo-normal{display: inline-block;}
body.nav-active .header .logo-wrap img.logo-scroll{display: none;}
body.nav-active .header .header-icon > a.reser-btn{ display: inline-block; border: 1px solid #fff; background-color: transparent; color: #fff; }
body.nav-active .header .header-icon > a i{ color: #fff;}
body.nav-active .header .menu-icon__line{ background-color: #fff; }
.cm-header .op_show{ opacity: 1; transition: .5s; animation: unset;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    .header .header-wrapper{ border-bottom: 0;}
    body.nav-active .header .header-wrapper{ border-bottom: 0;}
    body.nav-active .header.scroll .header-wrapper{ border-bottom: 0;}
    body.nav-active .header{ border-bottom: 1px solid rgba(255,255,255,.3);}
    body.nav-active .header.scroll{ border-bottom: 1px solid rgba(255,255,255,.3);}
  }


body{background-image: url(../img/common/bg.png); background-attachment: fixed; background-size: 797px 293px; background-position: center 100px; background-repeat: no-repeat;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    body{background-size: 69.87vw 25.60vw!important;}
}



#section02{ background-color: #fff; padding: 120px 0; position: relative; text-align: left;}
#section02 .wrap1440 .top-wrap{ display: flex; border-bottom: 1px solid rgba(112,112,112,.7); justify-content: space-between; padding-bottom: 20px; }
#section02 .wrap1440 .top-wrap .tit h3{ display: inline-block; padding-right: 30px; text-transform: capitalize;}
#section02 .wrap1440 .top-wrap .tit p{ display: inline-block;}
#section02 .wrap1440 .top-wrap .time{ text-align: right;}
#section02 .wrap1440 .top-wrap .time p{ display: inline-block; padding-left: 30px;}
#section02 .mid{ padding-top: 55px; display: flex; }
#section02 .mid ul.info-list{ width: 100%; position: relative;}
#section02 .mid ul.info-list li{ overflow: hidden;}
#section02 .mid ul.info-list li.pad-btm{ padding-bottom: 20px;}
#section02 .mid ul.info-list .big-tit{line-height: 24px;}
#section02 .mid ul.info-list .big-tit.col1{ width: 100%;}
#section02 .mid ul.info-list .p-tit{ width: 84px; line-height: 18px;}
#section02 .mid ul.info-list .p-info{width: calc(100% - 84px); line-height: 18px;}
#section02 .mid ul.info-list .p-info span{ font-size: 12px;}
#section02 .mid ul.info-list li.line-height .p-tit{ line-height: 18px;}
#section02 .mid ul.info-list li.line-height .p-info{ line-height: 18px;}
#section02 .mid ul.info-list li.last{ width: 100%; padding: 15px 20px; border-radius: 10px; background-color: #F8F8F8; }
#section02 a.reser-btn{ position: relative; display: block; width: 100%; height: 480px; border-radius: 10px; background-size: 100%; background-repeat: no-repeat; background-position: center; transition: .3s;} 
#section02 a.reser-btn:hover{ background-size: 105%;}
#section02 a.reser-btn h3{ position: absolute; top: 50%; width: 100%; text-align: center; letter-spacing: .3em;}
#section02 a.reser-btn .btn01{ display: inline-block; text-align: left; transition: .3s; width: 200px; height: 40px; line-height: 40px; position: absolute; padding: 0 20px; right: 20px; bottom: 20px;}
#section02 a.reser-btn .btn01 i{ width: 50%; line-height: 40px; text-align: left; float: left; transition: .3s;}
#section02 a.reser-btn .btn01 p{ width: 50%; line-height: 40px; text-align: right; padding-right: 5px; float: left; transition: .3s;}
#section02 a.reser-btn:hover .btn01 i{ padding-left: 50px; color: #D1972F;}
#section02 a.reser-btn:hover .btn01 p{ padding-right: 0; color: #D1972F;}
#section02 .btm{ width: 100%; height: 400px; border-radius: 10px; background-color: #fff; box-shadow: 0px 3px 6px #0000001A; margin-top: 40px; padding: 40px;}
#section02.scroll{ margin-top: 0;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    #section02{ padding: 40px 0; margin-top: 0;}
    #section02 .wrap1440 .top-wrap{ flex-direction: column; padding-bottom: 0; border-bottom: 0; }
    #section02 .wrap1440 .top-wrap > div{ line-height: 33px; border-bottom: 1px solid rgba(112,112,112,.7);}
    #section02 .wrap1440 .top-wrap .tit h3{ padding-right: 10px;}
    #section02 .wrap1440 .top-wrap .time{ text-align: left;}
    #section02 .wrap1440 .top-wrap .time p{ display: inline-block; padding-left: 0; padding-right: 9px;}
    #section02 .mid{ flex-direction: column; padding-top: 17px;}
    #section02 .mid .text-area{ padding-left: 0; padding-right: 0; text-align: left;}
    #section02 .mid .text-area h3{ padding-bottom: 20px; }
    #section02 .mid ul.info-list{ width: 100%; position: relative;}
    #section02 .mid ul.info-list li{ overflow: hidden;}
    #section02 .mid ul.info-list li.pad-btm{ padding-bottom: 20px;}
    #section02 .mid ul.info-list .big-tit{line-height: 24px;}
    #section02 .mid ul.info-list .big-tit.col1{ width: 100%;}
    #section02 .mid ul.info-list .p-tit{ width: 68px; line-height: 17px;}
    #section02 .mid ul.info-list .p-info{width: calc(100% - 68px); line-height: 17px; }
    #section02 .mid ul.info-list .p-info span{ font-size: 12px;}
    #section02 .mid ul.info-list li.line-height .p-tit{ line-height: 17px;}
    #section02 .mid ul.info-list li.line-height .p-info{ line-height: 17px;}
    #section02 .mid ul.info-list li.last{ width: 100%; padding: 15px 20px; border-radius: 10px; background-color: #F8F8F8; }
    #section02 a.reser-btn{ position: relative;  display: block; width: 100%; height: 29.49vw; border-radius: 10px; background-size: cover; background-repeat: no-repeat; background-position: center; transition: .3s; margin-top: 20px;} 
    #section02 a.reser-btn:hover{ background-size: cover;}
    #section02 a.reser-btn .btn01{ display: inline-block; text-align: left; transition: .3s; width: 200px; height: 40px; line-height: 40px; position: absolute; padding: 0 20px; right: 0; bottom: unset; left: 0; margin: 0 auto; top: calc(50% - 20px);}
    #section02 a.reser-btn .btn01 i{ width: 50%; line-height: 40px; text-align: left; float: left; transition: .3s;}
    #section02 a.reser-btn .btn01 p{ width: 50%; line-height: 40px; text-align: right; padding-right: 5px; float: left; transition: .3s;}
    #section02 a.reser-btn:hover .btn01 i{ padding-left: 50px; color: #D1972F;}
    #section02 a.reser-btn:hover .btn01 p{ padding-right: 0; color: #D1972F;}
    #section02 .btm{ width: 100%; height: 260px; margin-top: 20px; padding: 20px;}
}

#deco-img{ width: 100%; height: 742px; background-size: cover; background-repeat: no-repeat; background-position: center; display: flex; align-items: center; text-align: center;}
#deco-img p{ width: 100%;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    #deco-img{ height: 64.00vw; }
}


#section03{ padding: 120px 0 240px; text-align: center;}
#section03 div.none-mo{ display: flex!important; justify-content: space-between; flex-wrap: wrap;}
#section03 .room-con{ display: block; text-align: left; margin-bottom: 90px;}
#section03 .room-con:nth-child(2), #section03 .room-con:nth-child(5){ padding-top: 100px;}
#section03 .room-con .img-wrap{ position: relative; width: 460px; height: 560px;}
#section03 .room-con .img-wrap:after{ content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid rgba(174,173,173,0); transition: .5s; box-sizing: border-box;}
#section03 .room-con:hover .img-wrap:after{ border: 30px solid rgba(174,173,173,.8); }
#section03 .room-con .tit p{ display: inline-block;}
#section03 .room-con .tit p.enM{ letter-spacing: 0.02em;}
#section03 .room-con .tit p.koB{ padding-left: 10px;}
#section03 .room-con ul li{ line-height: 20px;}
#section03 .room-con ul li span{ padding-right: 5px;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    #section03{ padding: 50px 0;}
    #section03 div.none-mo{ display: none!important;}
    #section03 div.none-pc{ display: block!important; width: 100%;}
    #section03 .room-con{ display: inline-block; text-align: left; margin-bottom: 0;}
    #section03 .room-con:nth-child(2), #section03 .room-con:nth-child(5){ padding-top: 0;}
    #section03 .room-con .img-wrap{ width: 100%; height: 98.00vw;}
    #section03 .room-con .tit p.koB{ padding-left: 10px;}
}
