@charset "utf-8";

@import url(util.css);
@import url(font.css);
@import url(animate.min.css);

/* font */
@import url('../css2.css');
@import url('../css.css');
@import url('../css-1.css');
@import url('../css-2.css');


/* reset with normalize */
body,input,textarea,select,button,table{font-size:15px;font-family:'Noto Sans KR','Lora','Noto Sans Armenian','나눔 바른 고딕','맑은 고딕','Malgun Gothic','돋움','Apple SD Gothic Neo',sans-serif;letter-spacing: -.030em;color:#222}
/*
body{-ms-word-break:break-all;word-break:break-all}
*/
a{text-decoration:none !important;color:#282828}
a:hover,a:hover:focus,a:active{color:#282828}
a,button,input,textarea{-webkit-transition:border-color .4s,background .4s,color .4s,opacity .4s;transition:border-color .4s,background .4s,color .4s,opacity .4s}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0}
p{font-size:17px}
button{outline: none;border: 0;background: none;}
li{list-style:none}
address{font-style:normal}
table{width:100%}
dt{font-weight:400}
em{font-style:normal}
::selection{background-color:#be9d6f;color:#FFF}

/* Grid */
.row,.form-horizontal .form-group{margin-right:0;margin-left:0}
.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9{padding-right:0;padding-left:0}

/* common */
.blank{background:url(../img/blank.png)}
.pr{position:relative}
.overflow{overflow:hidden}
.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.d_iblock{display:inline-block !important}
.d_iline{display: inline !important}
.d-block{display: block !important}
.bg_full{position:absolute;top:-50%;left:-50%;width:200%;height:175%}
.bg_full .bg{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;min-width:50%;min-height:50%;max-width:none;border:0}
button.btn{height:auto !important}
.line-tab{border-bottom:2px solid #000 !important}
.line-tab>li>a, .line-tab>li>a:focus, .line-tab>li>a:hover{background:none !important;border:0 !important;color:#bbb}
.line-tab>li.active>a, .line-tab>li.active>a:focus, .line-tab>li.active>a:hover{color:#222 !important;font-weight: bold}
.img-responsive{width:100%}
#mask {position: absolute;left: 0;top: 0;z-index: 999;background-color: #000000;display: none;}
.img-xs{width:150px}
.m_br {display: none;}
/* Grid */
.w-base{max-width:1240px;margin:0 auto}
.w-base.v2{position: initial;max-width: 100%;padding-left:12%;}
.w1000{max-width:1000px;margin:0 auto}
.w90{width:90% !important}
.w100{width:100% !important}
.w200{width:200px}

/* heading */
.ff-play{font-family: 'Playfair Display', serif;line-height: 1}
.ff-lora{font-family: 'Lora', serif;line-height: 1}

.fc-wh{color:#fff !important}
.fc-blk{color:#292929 !important}
.fc-gray{color:#c9c9c9 !important}
.fc-orange{color:#ee7800 !important}
.bg-gray{background:#FAFAFA}
.fw300{font-weight: 300 !important}

/* button */
[class^=btn-]{display: inline-block}
.btn-attent{position: relative;padding:14px 40px 14px 50px;border-radius: 50px; background:#fff;font-size:19px;font-weight: bold; color:#222;box-shadow: 2px 2px 6px 4px rgba(0,0,0, .15)}
.btn-attent:hover{color:#30a955}
.btn-top{position: absolute;top:30px;right:20px;font-family:'Lora';color:#eee;}
.btn-basic{min-width:160px;border:1px solid #222;padding:14px 28px;text-align: center}
.btn-basic:hover{border-color:#015152;background:#f9f9f9}
.btn-wide{width:100%;padding:15px 0;text-align: center;font-size:22px;color:#fff;background:#015152}
.btn-wide:hover{background:#003c3d;color: #fff}
.btn-lg, .btn-lg:hover{padding:15px 0;background:#222 !important;color:#ddd;font-size:15px}

/* icon */
[class^=icon-]{display:inline-block;overflow:hidden;margin:0;padding:0;border:0;background-color:transparent;background-position:50% 50%;background-repeat:no-repeat;font-size:0;line-height:0;text-decoration:none;vertical-align:middle;text-indent:-1000em}
.icon-hd-logo{width:207px;height:50px;background:url(../img/logo.png);background-size:100% auto;background-repeat: no-repeat; background-position: center;}
.icon-logo-wh{width:100px;height:35px;background:url(../img/logo_wh.png);background-size:100% auto;background-repeat: no-repeat; background-position: center;}
[class^=icon-deco-]{position: absolute}
.icon-userplus{width:23px;height:24px;margin:-5px 0 0 4px;background:url(../img/ico_user.png)}
.icon-symbol-green{position: absolute;bottom:-80px;left:-28%;width:334px;height:391px;background:url(../img/eco_symbol_green.png)}

@media screen and (max-width:1024px){
	.icon-hd-logo{width:150px;}
}



/* slide */
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{background:#fff}

/* form */
.form-control{height:52px;border-radius: 0;font-size:16px}

/* slider */
.slick-slider{z-index: 9}
.slick-arrow{position: absolute;top:50%;left:5%;border:0;width:57px;height:57px;margin-top:-25px;background-size:auto 100%;background: url(../img/arrow_blk.png);font-size:0;z-index: 10}
.slick-arrow:hover{opacity: .7}
.slick-next{right:5%;left:auto;background-position: 100% 100%}
.slick-dots{position: absolute;display: inline-block;left:0}
.slick-dots li{float:left;margin-right:10px}
.slick-dots button{background:none;width:36px;border:0;border-bottom:2px solid #ADADAD;font-size:15px;font-weight: bold;color:#ADADAD;text-align: center;line-height: 2.1}
.slick-active button{color:#313131;border-color:#313131}
.dot-control{bottom:235px}
.main-slider .slick-arrow{top:auto;bottom:5%;left:50%}
.main-slider .slick-prev{margin-left:-70px}
.main-slider .slick-next{margin-right:-70px}
.slider__counter{position: absolute;width:100px;height:100px;right:150px;bottom:20px;font-size:64px;font-family: 'Playfair Display';color:#fff;text-align: right}
.slider__counter .here{margin:-43px 0 0 -48px}
.slider__counter .here:before{content: '';display: inline-block;position: absolute;top:70%;left:-110px;width:90px;height:1px;background:#fff}
.slider__counter .total{font-size:45px;opacity: .4}
.slider__counter span{position: absolute;line-height: 1}

/* progress bar */
.slider-progress {width: 100%;height: 7px;background: rgba(0,0,0,0.5);position: absolute;bottom: 0;z-index: 999}
.slider-progress .progress {width: 0%;height: 7px;background: #a3c542;}


/* animate */
.ani-stop{visibility:hidden;-webkit-animation-name:none !important;animation-name:none !important}
.ani_delay01{-webkit-animation-delay:.25s;animation-delay:.1s}
.ani_delay015{-webkit-animation-delay:.25s;animation-delay:.15s}
.ani_delay02{-webkit-animation-delay:.2s;animation-delay:.2s}
.ani_delay03{-webkit-animation-delay:.3s;animation-delay:.3s}
.ani_delay04{-webkit-animation-delay:.4s;animation-delay:.4s}
.ani_delay05{-webkit-animation-delay:.5s;animation-delay:.5s}

/* layout */
#wrap{overflow: hidden}
#container{padding:0}
.px-sect{position:relative}
.pr{position: relative}

/* header */
#hd{position:fixed;z-index:30;top:0;right:0;left:0;height:75px;z-index: 99;transition: all .5s;overflow: hidden;background:rgba(255,255,255, 1);box-shadow: 0 0 10px 0 rgba(0,0,0, .1)}
#hd h1{position: absolute;margin:13px 0 0 35px}
#hd h1 img{width:130px}
.btn-contact{position: absolute;top:0;right:0;display: inline-block;width:90px;height:62px;background:#FC2A2A;font-size:14px;line-height:61px;color:#fff}
.btn-contact.v2{height:45px!important;line-height:46px !important}
.btn-contact:hover{color:#fff}
.ft-scroll .fixebox-user, #wrap.sub-p .fixebox-user{position: relative !important}

#gnb {overflow: hidden; position:relative;top:25px;right:25px;float:right;display: inline-block;}
#gnb>li{position: relative;float:left;min-width:150px;text-align: center;font-size>:17px}
#gnb>li>a{}
#gnb>li>a>*{position: absolute;left:0;display: inline-block;width:100%;text-align: center}
#gnb>li:first-child{margin-left:0}
#gnb>li a{display: inline-block;height:35px;font-size:19px;font-weight: 500}
#gnb>li>a:hover{font-weight: bold}
#gnb>li a.on{color:#FC2A2A}
#gnb>li ul{display: none}
#gnb>li ul a{font-size:1em;color:#666}
#gnb>li ul a:hover{color:#5ba12d}

.menu-btn {display: none;right:2px;position: absolute;top:36px;width: 32px;transform: translate(-50%,-50%);z-index: 9999}
.menu-btn:before, .menu-btn:after {background-color:#000;content: '';display: block;height: 4px;transition: all 200ms ease-in-out;}
.menu-btn:before {box-shadow: 0 10px 0 #000;margin-bottom: 16px}
.menu-btn:after{width:19px}
.menu-btn:hover:after {width:36px}
.menu-nav .menu-btn{top:0}
.icon-close{position: absolute;top:30px;right:23px;width:23px;height:23px;background:url(../img/ico_close.png);z-index: 9999}

#day2021515, #day2021516{background-color:#e6e6e6;}

/* common */
.w50{width:50%}
.w70{width:70%}
.txt-vertical{-ms-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);transform: rotate(-90deg);}
.tb-areaset{position: absolute;top:0;right:0;bottom:0;left:0}
.tb-type{display: table;position: relative;width:100%;height:100%}
.tb-type>div{display: table-cell;height:100%;vertical-align: middle}
.tb-type.direct{direction: rtl;margin-top:60px}
.dv-line{display: inline-block;width:240px;height:1px;background:#eee;opacity: .2}
.right-line{display: none}
.table .table{background:none}
.table-responsive{border:0}
.nav-tabs{border:0}
.nav-tabs>li>a{padding:13px 15px;min-width:150px;font-size:20px;border-radius: 0;text-align: center}
.nav-tabs>li>a, .nav-tabs>li>a:focus, .nav-tabs>li>a:hover{border:1px solid #666;background:#fff;margin:0 0 0 -1px}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover{background:#000;color:#fff}
.ellipsis2{overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.lst-dot li{position: relative;margin-left:15px;margin-bottom:15px}
.lst-dot li:before{content: '•';display: inline-block;position: absolute;margin-left:-13px}
.con-area{min-height:700px;max-width:1100px;margin:0 auto;padding:0 0 150px}
.d-flex{display: flex;justify-content: space-between;}
.ag-area{margin-top:15px;font-size:15px;line-height: 15px;font-weight:bold !important;color:#222}
.hidden-sm{display: none}



.down-box{position: absolute;right:-20px;border:1px solid #dcdcda;margin-top:66px;padding:40px 54px 40px 40px}
.down-box img{width:100%}
.down-box ul{margin-top:30px}
.down-box li{margin:8px 0}
.down-box a{display: inline-block;text-align: center;font-weight:500;width:100%;padding:14px;border:1px solid #000}
.down-box li:first-child a{border:0;background: rgb(142,173,60);
background: linear-gradient(13deg, rgba(142,173,60,1) 0%, rgba(106,161,143,1) 100%);color:#fff;box-shadow:1px 1px 5px 3px rgba(0,0,0, .06)}
.img-sdw{box-shadow:5px 5px 15px 3px rgba(0,0,0, .15)}


/* index */
.index-nv{position: fixed;top:40%;left:50px;z-index: 99}
.index-nv ol{display: inline-block}
.index-nv li{line-height: 30px}
.index-nv li a{position: relative;display: inline-block;width:10px;height:10px;background:#ddd;border-radius: 50px}
.index-nv li.on a:before{content:'';display: inline-block;position: absolute;top:50%;left:50%;width:20px;height:20px;border:1px solid #ddd;border-radius: 50px;margin:-10px 0 0 -10px}
#index .main-slider{margin-top:70px}
#index .main-slider li{height:900px}
.main-slider li{position: relative;overflow: hidden; }
.main-slider li.i1{background-image: url(../img/mainslide01.jpg)}
.main-slider li.i2{background-image: url(../img/mainslide02.jpg)}
.main-slider li{background-size:cover;background-position: 50% 50%}
.main-slider li p{font-size:35px;color:#fff;line-height:1.2;font-weight: 100;text-shadow: 0px 0px 9px rgba(0, 0, 0, .7)}
.main-slider li p span b{font-size:1.3em;font-weight: 300}
.scroll-info{position: absolute;bottom:13%;left:-13px;font-family:'Lora';font-size:14px;color:#fff;transform: rotate( -90deg );-webkit-transform: rotate( -90deg );z-index: 999}
.scroll-info .ico-mouse{display: inline-block;position: absolute;width:50px;height:30px;border-radius: 100px;border:1px solid #eee}
.scroll-info .ico-mouse+span{line-height: 30px;padding-left: 64px;}
.scroll-info .ico-mouse em{display: inline-block;position: absolute;margin:11px 0  0 28px;width:5px;height:5px;border-radius: 5px; background:#fff}

.sect-info{position: relative;padding:65px 0;text-align: center;font-size:22px}
.sect-info p{position: relative;z-index: 9}
.sect-info.v2{position: relative;padding:70px 0;z-index: 99}
.sect-info.v2:before{content: '';display: inline-block;position: absolute;left:50%;bottom:-40px;width:1px;height:80px;background:#000}

.img-group{position: relative;display: inline-block}
.img-group>span{position: relative;display: inline-block;z-index: 9;overflow: hidden}
.img-group em{position: relative;display: inline-block;z-index: 9;}
.img-group:before{content:'';display: inline-block;position: absolute;width:100%;height:100%;top:15px;right:-24px;background: rgb(223,233,233);
background: linear-gradient(315deg, rgba(223,233,233,1) 0%, rgba(242,243,243,1) 100%)}
.img-group.v2 em{box-shadow:-7px 7px 13px 0 rgba(0,0,0, .3)}
.img-group.v2:before{content:'';left:-24px;right:auto;}
.img-group.type02:before{background: rgb(118,116,107);
background: linear-gradient(344deg, rgba(118,116,107,1) 0%, rgba(100,87,75,1) 100%);}

.txt-ref{position: absolute;bottom:40px;left:120px;z-index: 99;font-size:13px;color:#ddd}
.txt-ref-img{position: absolute;top:30px;right:30px;z-index: 99;font-size:13px;color:#fff}
.txt-ref-box{position: relative;margin-top:20px;background:rgba(255,255,255, 1);border:1px solid #eee;padding:15px 30px;font-size:13px;line-height: 1.8}
#index section h3{position: relative;font-size:38px;font-weight:500 !important; color:#000}
#index h3+p{position: relative;margin-top:12px;line-height:1.9}
#index .sect01{position: relative;padding:20px 0 110px}
#index .sect01 h3{margin-bottom:40px;margin-top:70px}
#index .sect01 h3+p{margin-top:50px}
#index .sect01 h3 small{display: block;font-size:.55em;padding-bottom:15px;line-height: 1.4em}
#index .sect01 h3:before{content:'';display: inline-block;position: absolute;left:0;bottom:-40px;width:23px;height:3px;background:#000}
#index .sect02{overflow: hidden}
#index .sect02>div{height:480px;background:url(../img/main_visual.png);background-position: 50% 50%;background-size:cover;background-attachment: fixed}
#index .sect03{overflow: hidden;padding:100px 0;background:url(../img/bg_area01.png);background-position: 50% 50%;background-repeat: no-repeat;background-size:cover}
#index .sect04{padding:80px 0}
#index .sect04 .tit-area{position:relative;top:0;z-index: 9}
#index .sect04 .tit-area span b{font-size:65px;letter-spacing: -.065em}
#index .sect04 .iso-area{padding-top:0}
#index .sect04 h3+p{position: relative;font-size:18px;line-height: 1.7}
#index .sect04 h3+p:before{content:'';display:inline-block;position: absolute;bottom:-30px;left:0;width:23px;height:3px;background:#000}

.deco-line{display: inline-block;position: absolute;bottom:130px;width:100%;height:1px;background:#eee}

#index .sect03 h3, .life-slider-area{padding-left:16%}
section h3 a{display: inline-block; border-bottom:2px solid #222;font-size:.5em;font-weight: normal;font-family: 'Lora'}
section h3 a:hover{opacity: .6}
#index .sect03 h3 a{color:#fff;border-color:#fff}
.life-slider-area{width:50% !important}
.life-inven-area{margin-top:7%;margin-right:-150px}
[class^=life-slider] h4{letter-spacing: -.055em}
.life-slider {margin-top:30px}
.life-slider li{position: relative}
.life-slider .slick-list{padding:0 !important}
.life-slider .slick-list span{box-shadow: 12px 12px 18px 4px rgba(0,0,0, .4)}
.life-slider .slick-list span, .life-slider-inven .slick-list span {display: inline-block;position: relative}
.life-slider .slick-list span i, .life-slider-inven .slick-list span i{position: absolute;right:0;bottom:0;left:0;height:130px;background:url(../img/bg_cover.png);background-repeat: repeat-x;z-index: 5}

.life-slider-inven li {position: relative;padding-bottom:55px;margin-right:30px}
.life-slider-inven .slick-list{padding:0 60px 0 0!important}
.life-slider-inven .s-info{position: absolute;bottom:17px;left:20px;z-index: 9}
.life-slider-inven .s-info h4{font-size:28px;color:#ddd;}
.life-slider-inven .slick-list span i{height:80px;background-size:auto 100%}

.life-slider .slick-arrow{left:-100px;width:76px;height:76px;margin-top:-80px;background:url(../img/arrow_blk_lg.png);background-repeat: no-repeat}
.life-slider .slick-next{left:auto;right:-100px;background-position: 100% 100%}
.life-slider .slick-list{overflow: inherit}
.life-slider .num{position: relative;display: inline-block;font-size:80px;font-family: 'Playfair Display';color:#fff;font-style: italic;line-height: 1}
.life-slider .num:before{content:'';display: inline-block;position: absolute;bottom:-25px;left:-100px;width:184px;height:3px;background:#fff}
.life-slider .s-info{position: relative;margin:-150px 0 0 30px;z-index: 10}
.life-slider .s-info h4{margin-top:45px;font-size:32px;font-weight: bold; color:#fff}
.life-slider .s-info h4+p{margin-top:6px;font-size:15px;font-weight:300; color:#fff;line-height: 1.8}
.life-slider-inven .slick-current {display: none}

.box-nav{position: relative;margin-top:50px;border-bottom:0;z-index: 9}
.box-nav li+li{margin-left:-1px}
.box-nav button.tab_showroom{width:110px;height:110px;margin:0;padding:60px 15px 10px 0;border-radius: 0;border:1px solid #eee;background:#fff;text-align:right;font-size:20px}
.box-nav button.tab_showroom.active{position: relative;border:0;background:#222;color:#fff;font-weight: bold;box-shadow:1px 1px 7px 3px rgba(0,0,0, .2);z-index: 5}
.box-nav button.tab_showroom.active:before{content: '';display: inline-block;position: absolute;top:5%;left:5%;width:89%;height:90%;border:1px solid #a3c542}
.box-nav-sm{position: relative;display: inline-block}
.box-nav-sm>li>a, .box-nav-sm>li>a:focus, .box-nav-sm>li>a:hover{border-color:#eee;color:#666;font-weight: bold}
.box-nav-sm>li.active>a, .box-nav-sm>li.active>a:focus, .box-nav-sm>li.active>a:hover{background:#222;box-shadow: 3px 3px 10px 3px rgba(0,0,0, .2);z-index: 2}
.box-nav-sm a{position: relative;padding:17px 15px !important}
.box-nav-sm li.active a:before{content: '';display: inline-block;position: absolute;top:5%;left:4%;width:93%;height:90%;border:1px solid #a3c542}
.area-info{position: relative;width:22%;margin-top:60px;text-align:left;z-index: 9}
.area-info h4{position: relative;margin-bottom:30px;font-size:42px;font-weight: bold;color:#666;letter-spacing:-.085em}
.area-info h4:before{content: '';display: inline-block;position: absolute;left:0;bottom:-10px;width:100%;height:3px;background:#666}
.area-info li{padding:15px 0;border-bottom:1px solid #d1d1d1}
.area-info h5{font-size:17px;font-weight: bold;color:#222}
.area-info h5+p{font-size:16px;line-height: 1.8}

.iso-box span{display: inline-block;width:75%;padding:0 0 60px 40px;float:right}
.int-area{margin-top:180px}
.showroom {display: none;}
.showroom_slide { width: 100%;height: 100%;display: inline-block;display: none;}
#showroom_1 {display: block;}
#showroom_slide_1 {display: block;}
[class^=sub-slider__]{position: absolute;z-index: 9;top:50%;left:20px;border:0;background:0;font-size:0;width:23px;height:42px;background:url(../img/arrow_wh.png)}
.sub-slider__next{background-position: 100% 100%;right:20px;left:auto}

.type-info-box{table-layout: fixed;width:100%;padding:30px 0;margin-top:30px;box-shadow: 3px 3px 10px 3px rgba(0,0,0, .1);background:#fff}
.type-info-box>div:first-child{width:22%;font-size:41px;font-weight: bold;color:#ccc}
.type-info-box>div{position: relative;font-size:20px}
.type-info-box>div p{color:#666}
.type-info-box>div+div:before{content: '';display: inline-block;position: absolute;left:0;width:1px;height:100%;background:#dbdbdb}
.type-info-box+div{min-height:410px}

/* sub */
.main-slider.sub{overflow: hidden;height:280px;}
.main-slider.sub li{position: relative;padding:140px 0 55px}
.main-slider.sub li:before{content: '';position: absolute;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0, .5)}

.main-slider.sub .sub01{background-image: url(../img/bg_sub01.png)}
.main-slider.sub .sub02{background-image: url(../img/bg_sub02.png)}
.main-slider.sub .sub03{background-image: url(../img/bg_sub03.png)}
.main-slider.sub .sub04{background-image: url(../img/bg_sub04.png)}
.main-slider.sub .sub05{background-image: url(../img/bg_sub05.png)}
.tab-content>.tab-pane{padding:30px 0 50px}

.pagination>li{display: inline-block;margin:0 4px}
.pagination>li.on{border:0}
.pagination>li.on a{background:#015152;color:#fff}
.pagination>li>a, .pagination>li>span{min-width:40px;height:40px;color:#222}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{background:#333 !important}
.pagination>li:first-child>a, .pagination>li:first-child>span, .pagination>li:last-child>a, .pagination>li:last-child>span{border-radius: 0}
.tb-area-info{color:#ddd;text-align: center;font-size:18px;font-weight: 300}
.tb-area-info tr th{border-top:2px solid #be9d6f !important;border-bottom:1px solid #be9d6f;padding:10px;text-align: center;font-size:16px;color:#be9d6f}
.tb-area-info tr td{padding:10px 0;border-bottom:1px solid #67737b}
.tb-area-info tr td b{font-size:20px;color:#fff}
.tb-area-info tr.result td{background:#556169;color:#fff}

.sub-p h3{position: relative;margin-bottom:20px;font-size:40px;font-weight: bold;letter-spacing: -.035em}
.sub-p h3.fc-wh{padding-bottom:30px}
.sub-p h3.fc-wh:before{content: '';display: inline-block;position: absolute;bottom:0;width:23px;height:3px;background:#fff}
.sub-p h3.fc-wh.none:before{display: none}
.sub-p h3.fc-wh+p{line-height: 1.9}
.sub-p h3+p{text-align: center;margin-bottom:40px}

.step-area{width:65%;margin:0 auto;letter-spacing: -.075em}
.step-area b{display: block;font-size:28px;font-weight: bold}
.step-area p{font-size:20px}
.step-area li{position: relative}
.step-area li+li:before{content: '';display: inline-block;position: absolute;top:50%;left:-10px;width:22px;height:43px;margin-top:-22px;background:url(../img/ico_arrow.jpg)}
[class^=icon-contact]{width:99px;height:99px;background:url(../img/ico_con01.jpg)}
.icon-contact02{background:url(../img/ico_con02.jpg)}
.icon-contact03{background:url(../img/ico_con03.jpg)}
.pg-contact .sect02{padding-bottom:100px;margin-top:80px;background:url(../img/bg_location.jpg);background-size: cover;background-repeat: no-repeat;background-position: 50% 90px}
.location-info{position: relative;margin-top:60px;padding:40px;border:1px solid #eee;box-shadow:3px 3px 10px 3px rgba(0,0,0, .1); background:#fff;}
.location-info{position: relative}
.location-info .titarea{padding-bottom:15px}
.location-info .titarea p:first-child{padding:15px 0 12px;font-size:20px;font-weight: bold; color:#000}
.location-info .titarea p{margin-bottom:10px}
.location-info .titarea p small{display: inline-block;margin-left:18px}
.location-info img{display: inline-block;border:1px solid #eee}
.icon-location-blk{width:14px;height:16px;background:url(../img/ico_location_blk.jpg)}
.icon-location-call{width:14px;height:16px;background:url(../img/ico_location_call.jpg);background-size:100% auto;background-repeat: no-repeat}

.pg-home .slider-area{padding:0 0 0 260px}
.pg-home .sect01{padding:100px 0 ;background:#f3f2f0;overflow: hidden}
.pg-home .sect01 h3, .pg-home .sect03 h3{position: relative;padding-bottom:10px;text-align: center;z-index: 9}
.pg-home .sect02{padding:80px 0}
.pg-home .sect02 .i-left{margin-right:-15px}
.pg-home .sect02 .i-right{margin-top:40px;margin-left:-15px}
.pg-home .sect03{padding:90px 0 100px;background:url(../img/bg_color.jpg);background-size:cover}
.pg-home .sect05 {padding:80px 0}
.center-border-type{position: relative;padding-bottom:15px}
.center-border-type:before{content: '';display: inline-block;position: absolute;width:25px;height:3px;background:#000;bottom:-8px;left:50%;margin-left:-13px}
.center-border-type+p{line-height: 1.8}

/* footer */
.fixebox-user{position: relative;width:100%;padding:17px 0;background:url(../img/house_banner_bg.jpg);background-size:cover;font-size:17px;line-height: 1.6;color:#fff;z-index:99}
.fixebox-user .row{padding:10px 30px;border:1px solid #818e83;}
.fixebox-user p{line-height: 1.4em;font-size:.9em}
.fixebox-user p em{display:block;font-size:11px;font-weight: bold;color:#70a380}
#ft{background:#0c0c0c;font-weight:300; font-size:15px;color:#eee;text-align:left}
#ft .icon-logo-wh{position: absolute;}
#ft dt{float:left;width:70px;margin-right:10px}
.ft-area{position: relative;padding:35px 70px 30px}
.ft-area .tit{font-weight:500;color:#dd7e2c;margin-bottom:14px}
.ft-area .copy {font-size:.9em;margin-bottom:5px}
.ft-area .copy span{color:#eee}
.ft-area .copy em{color:#868686;padding-right:5px}
.ft-area .copy span+em{padding-left:20px}
.ft-area .sitemap li{line-height:2;}
.ft-area .sitemap a{color:#868686}
.ft-area .sitemap a:hover{text-decoration: underline !important}
.ft-area .sitemap span{display: inline-block;width:140px;color:#eee}
.copyright-p{position: absolute;top:28px;font-size:10px;color:#5b5b5b}

/* modal */
.modal-content{border-radius: 0;border:0}
.modal-header{padding:40px 30px 15px;background-color:#be9d6f;background-image:url(../img/eco_symbol_brw.png);background-position:95% 100%;background-repeat: no-repeat;font-size:30px;color:#fff}
.modal-title{font-size:30px;font-weight: bold;}
.modal-body{padding:30px 30px;background:#fbfbfb}
.modal-body label{font-size:17px;font-weight:500}
.modal-body .chk_box1{margin-top:10px;font-size:18px;line-height: 16px}
.modal-header .close{float:none;position: absolute;top:0;right:-65px;width:65px;height:65px;margin:0;background:url(../img/btn_modal_cls.png);opacity: 1}
.modal-header .close:hover{opacity: .8}

.t-box{min-height:150px;overflow-y: scroll; padding:10px 20px;border:1px solid #ccc;background:#fff;font-size:15px;color:#666}

/* mobile */
/*----------- mobile -----------*/
#mNav{display:none;overflow-x: hidden;overflow-y: auto;-webkit-overflow-scrolling:touch;position:fixed;top:0;bottom:0;left:0; right:0; z-index:100;background-color:#fff;z-index: 999999999;box-shadow:0 0 10px 5px rgba(0,0,0, .15);border-left:3px #4bb95d solid;background-image:url(../img/logo_lh.png);background-repeat: no-repeat;background-size:65px auto;background-position:16px 7px}
#mNav a{ display:block; margin:0 20px -1px; border-bottom:1px solid #eee; font-size:17px; line-height:55px; color:#333}
#mNav .caret{ float:right; margin-top:24px; border-width:5px; color:#222}
#mNav>ul{margin-top:66px}
#mNav>ul>li>a{font-weight:500}
#mNav>ul li:last-child a {border-bottom:none;}
#mNav ul ul{ display:none; padding-bottom:20px; background:#f4f4f4}
#mNav ul ul a{ color:#333;font-size: 1.1em}
#mMenu{ display:none;position:absolute;top:0; right:5px}
#mMenu a{ float:left; width:45px; height:40px;}
#mNav .mb-cls{display: inline-block;position: absolute;top:25px;right:0px;width:20px;height:20px;background:url(../img/ico_close.png);background-repeat: no-repeat;background-size:100% auto;border:0 !important}
.if-scroll #mMenu{top:11px}
.call-info{padding:50px 20px 0;font-weight: bold}
.call-info a{margin: 0 !important;border:0 !important;font-family: 'Playfair Display';font-size:1.8em !important;line-height: 1.2em !important}

.chk_box1 { position: relative; }
.chk_box1 input[type="checkbox"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }
.chk_box1 input[type="checkbox"] + label { display: inline-block; position: relative; letter-spacing: -.50px; padding-left: 23px;cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
.chk_box1 input[type="checkbox"] + label:before { content: ''; position: absolute; left: 0; top: 1px; width: 16px; height: 16px; line-height: 16px; text-align: center; font-weight: normal; background: url("../img/check/bg_chk.gif") no-repeat center center; background-size: 16px 16px; }
.chk_box1 input[type="checkbox"]:checked + label:before { content: ''; font-weight: normal; background: url("../img/check/bg_chk_on.gif") no-repeat center center; background-size: 16px 16px; }

.chk_box2 { position: relative; }
.chk_box2 input[type="checkbox"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }
.chk_box2 input[type="checkbox"] + label { display: inline-block; position: relative; letter-spacing: -.50px; padding-left: 23px;color: #333; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
.chk_box2 input[type="checkbox"] + label:before { content: ''; position: absolute; left: 0; top: 1px; width: 16px; height: 16px; line-height: 16px; text-align: center; font-weight: normal; background: url("../img/check/bg_chk02.gif") no-repeat center center; background-size: 16px 16px; }
.chk_box2 input[type="checkbox"]:checked + label:before { content: ''; font-weight: normal; background: url("../img/check/bg_chk02_on.gif") no-repeat center center; background-size: 16px 16px; }


.cal-box h1{font-weight: 800;margin-top: 0px;}
.cal-box .cal-header{display: flex;justify-content: space-between;margin-bottom:30px}
.cal-box .cal-header button{position: relative;z-index: 99;background:#fff;border:0;box-shadow: 0 0 5px 5px rgba(0,0,0, .05);border-radius: 50px;min-width:270px;height:75px}
.cal-box .cal_ym{position: absolute;width:100%;left:0;text-align: center}
.cal-box .cal_ym h1{font-size: 50px;line-height: 1;   }
.cal-box .cal_ym h2{font-size:25px;color: #ccc;   line-height: 1;}
.cal-box .cal-header button.cal_prev{background: url('../img/cal_prev.png') #fff 95% no-repeat;background-size:40px auto;}
.cal-box .cal-header button.cal_next{background: url('../img/cal_next.png') #fff 5% no-repeat;background-size:40px auto;padding-left:40px}
.cal-box .cal-header button .btn_ym{width:62px;display: table-cell;vertical-align: middle;}
.cal-box .cal-header button .cal_info{text-align: left;display: table-cell;padding:15px 15px 15px 0;vertical-align: middle;color: #666;font-size:14px;line-height:1.5;}
.cal-box .cal-header button .btn_ym h1{font-size: 25px;}
.cal-box .cal-header button .btn_ym h2{font-size: 15px;color:#666666;}


.pg-reservation .sect{margin-bottom:20px}
.pg-reservation .row{overflow: hidden;margin:0 -10px 60px}
.pg-reservation .col-5{float:left;width:50%;padding:0 10px}
.pg-reservation .col-5>div{min-height:500px;padding:15px 20px 25px;border:1px solid #dfdfdf}
.pg-reservation .col-12>div{margin:15px 10px 18px;padding:15px 20px 25px;border:1px solid #dfdfdf}
.pg-reservation .col-12>div ul{overflow: hidden}
.pg-reservation .col-12>div li{float:left;}
.area-pic li a{display: inline-block;padding:16px 40px 16px 70px;margin:20px 0 0;font-size:20px;color:#999;font-weight: bold !important;border:2px solid #eee;background-image:url(../img/check_type0.png);background-size:auto 30px;background-repeat: no-repeat;background-position: 11px}
.area-pic li a.on{background-image:url(../img/check_type1.png);color:#222;border-color:#98c719}
.pg-reservation .col-12>div li+li a{margin-left:20px}

.pg-reservation h3{position: relative;margin-bottom:12px;padding-left:13px !important;font-size:20px !important;font-weight: bold !important;color:#52b949 !important}
.pg-reservation h3:before{content: '';display: inline-block;position: absolute;width:6px;height:6px;background:#52b949;border-radius: 20px;margin:9px 0 0 -10px}
.pg-reservation h4{margin-top:0 !important;font-size:20px !important;font-weight: bold !important;color:#222 !important;line-height: 39px !important;padding-bottom:10px;border-bottom:1px solid #222}
.pg-reservation .form-control{height:47px;border:1px solid #ddd;border-radius: 3px;background:#fff !important}
.pg-reservation .form-control:focus{border-color:#666;box-shadow:0 0 5px 3px rgba(0,0,0, .05)}
.pg-reservation .form-control:read-only:focus{box-shadow:none;border-color:#ddd}
.pg-reservation .btn-area{width:100%;text-align: center;padding-bottom:80px}
.pg-reservation .btn-area button{display: inline-block;padding:16px 45px;color:#fff;font-weight: bold;border:0;background:#52b949;font-size:20px;box-shadow:2px 2px 8px 2px rgba(0,0,0, .07)}
.pg-reservation .btn-area button:hover{background-color:#469f3f}
.pg-reservation .btn-area button.btn-cc{border:1px solid #ddd;background:#fff;color:#333;font-weight: normal;box-shadow: none;color:#666}
.pg-reservation .btn-area button.btn-cc:hover{color:#333}
.terms-box{overflow-y: scroll;height:200px;padding:20px;background:#f9f9f9;border-radius: 10px;font-size:14px;line-height: 1.6em}
.user-info{margin-top:35px}
.user-info .table{border-bottom:1px solid #999}
.user-info .table th{width:20%}
.user-info .table th, .user-info .table td{border-top:1px solid #999;padding:12px 0;font-size:16px;color:#222;line-height: 44px}
.icon-cal{width:30px;height:30px;margin-top: 4px;background:url(../img/i_cal.png);background-size:100% auto}
.icon-time{width:30px;height:30px;background:url(../img/i_clock.png);background-size:100% auto}
.user-info .table td select, .user-info .table td input[type='tel']{display: inline-block;width:20%}
.info-box{position: relative;padding:30px 30px;border:1px solid #eee;}
.info-box>ul>li+li>div{margin-top:10px}
.info-box>ul>li{display: flex;margin:8px 0}
.info-box>ul>li em{display: inline-block;width:119px;height:40px;margin-right:10px;background:#333;border-radius:30px;text-align: center;line-height: 40px;font-weight:bold;font-size: 18px; color:#fff;}
.info-box>ul>li p{line-height:1.8em;font-size:18px;color:#222;font-weight: 500}
.info-box>ul>li p small{font-size:.7em}
.info-box>ul>li ol li{font-size:15px;line-height: 1.8em}

.supercal, .supercal table{width:100%}
.supercal-footer {display: none !important}
.supercal-header{font-size:25px;font-weight: bold;color:#222;background:#fff}
.supercal-header button{font-size:14px;padding:5px 15px;border-radius: 50px;color:#999}
.supercal-month th, .supercal-month td{text-align: center;font-size:18px}
.supercal-month th{padding:10px 0 15px;border:0 !important;font-weight: normal;font-size: 1em;}
.supercal-month td{padding:17px !important;border:0 !important}
.supercal td.selected{background:#52b949 !important;color:#fff}
.data-area{padding:30px 0;text-align: center;color:#666;font-size:18px}

.time-pic{overflow: hidden;margin:0 -5px}
.time-pic li{float:left;width:33.3333333%;padding:5px}
.time-pic li a{display: inline-block;width:100%;padding:15px 20px;text-align: center;font-weight: bold;font-size:18px;background:#f5f5f5;color:#999;border:2px solid #eee}
.time-pic li a.on{background:#52b949 !important;border-color:#4aa742;color:#fff}

.rev-box{background:#f9f9f9;border-radius: 10px;padding:25px}
.rev-box dt, .rev-box dd{font-size:16px;padding:10px 0}
.rev-box dt{float:left;width:100px;font-weight: bold}
.rev-box dd{padding-left:100px}

.sub_tab{width:48%;margin:13px auto 40px;display: flex;border: 1px #ddd solid;}
.sub_tab li{width: 50%;position: relative}
.sub_tab li.one{width:100%}
.sub_tab li::after{content: "";right: 0px;top: 50%;transform: translate(-50%, -50%);position: absolute;display: block;width: 1px;height: 1.04166666vw;background: #ddd}
.sub_tab li:last-child::after{display: none;}
.sub_tab li button{ width: 100%;height:55px;color: #999;font-size:20px;background:none;border:none}
.sub_tab li button.active{color: #222;font-weight: bold;border-style: solid;border-image: linear-gradient(to right, #55b94d 0%, #9fcf18 100%);border-image-slice: 1;border-image-width:0px 0px 3px 0px}
#tab_2,#tab_3,#tab_4{display: none;}

.hidden-sm{display: none}

.cal_ta {width: 100%;border-collapse: collapse;}
.cal_ta th, .cal_ta td  {width: 100%;border:1px solid #e7e7e7;width: 14.28%;text-align: center;box-sizing: border-box;}
.cal_ta th {font-size: 14px;height:25px;}
.cal_ta th:first-child .date {color:#ff4d4d;}
.cal_ta th:last-child .date {color:#5682ff;}
.cal_ta td {height:9vw;position: relative;padding-top: 2vw;}
.cal_ta td .date {position:absolute;top:0px; left:0; width:100%;height:2vw;line-height: 2vw;}
.cal_ta td.green.one {border:3px solid #6ba73e;}
.cal_ta td.green.start {border-left:3px solid #6ba73e;}
.cal_ta td.green {border-top:3px solid #6ba73e;border-bottom:3px solid #6ba73e; }
.cal_ta td.green.end {border-right:3px solid #6ba73e;}
.cal_ta td.on.green .date {background: #6ba73e;}

.cal_ta td.blue.one {border:3px solid #2F96BD;}
.cal_ta td.blue.start {border-left:3px solid #2F96BD;border-top:3px solid #2F96BD;border-bottom:3px solid #2F96BD; }
.cal_ta td.blue {border-top:3px solid #2F96BD;border-bottom:3px solid #2F96BD; }
.cal_ta td.blue.end {border-right:3px solid #2F96BD;border-top:3px solid #2F96BD;border-bottom:3px solid #2F96BD; }
.cal_ta td.on.blue .date {background: #2F96BD;}

.cal_ta td.red.one {border:3px solid #EE434B;}
.cal_ta td.red.start {border-left:3px solid #EE434B;border-top:3px solid #EE434B;border-bottom:3px solid #EE434B; }
.cal_ta td.red {border-top:3px solid #EE434B;border-bottom:3px solid #EE434B; }
.cal_ta td.red.end {border-right:3px solid #EE434B;border-top:3px solid #EE434B;border-bottom:3px solid #EE434B; }
.cal_ta td.on.red .date {background: #EE434B;}

.cal_ta td.yellow.one {border:3px solid #EAC30F;}
.cal_ta td.yellow.start {border-left:3px solid #EAC30F;border-top:3px solid #EAC30F;border-bottom:3px solid #EAC30F; }
.cal_ta td.yellow {border-top:3px solid #EAC30F;border-bottom:3px solid #EAC30F; }
.cal_ta td.yellow.end {border-right:3px solid #EAC30F;border-top:3px solid #EAC30F;border-bottom:3px solid #EAC30F; }
.cal_ta td.on.yellow .date {background: #EAC30F;}

.cal_ta td .txt {font-size:14px}
.cal_ta td.on .date {color:#fff;}
.cal_ta td .time {color:#999;font-size:13px;}


.sub_ta {width: 100%;}
.sub_ta th {background: #f2f2f2;;}
.sub_ta th,.sub_ta td {border:1px solid #666; height: 60px;text-align: center;font-size: 17px;}

@media screen and (max-width:768px){
.sub_ta th,.sub_ta td {border:1px solid #666; height: 30px;text-align: center;font-size: 10px;}
}

@media screen and (min-width:1280px){
    .cal_ta td {height: 120px;}
}

@media screen and (max-width:870px){

    .cal_ta td .date {font-size: 11px;}
    .cal_ta td {height:70px}
    .cal_ta th {font-size: 12px;}
    .cal_ta td .txt {font-size:12px}
    .cal_ta td .time {display: none;}
}

@media screen and (max-width:500px){
    .cal_ta th {font-size: 11px;}
    .cal_ta td .date {font-size: 9px;height:15px;line-height: 15px;}
    .cal_ta td {height:65px;padding-top: 15px;}
    .cal_ta td .txt {font-size:8px}
}

@media screen and (max-width:400px){
    .cal_ta th {font-size: 11px;}
    .cal_ta td .date {font-size: 8px;}
    .cal_ta td .txt {font-size: 8px;letter-spacing: -1px;}
}


@media screen and (max-width:1400px){
    .photo-slider .slick-list{padding:0px 100px 0 0 !important}
    .photo-slider .slick-slide{padding-left:80px}
    .photo-slider .i2{left:-60px}
    .w-base{padding:0 40px}
}

@media screen and (max-width:1200px){
}


.pc{display: block !important;}
.mobile{display: none  !important;}
.pc_flex{display: flex !important;}
.mobile_flex{display: none  !important;}
.pc-inline{display: inline-block!important;}

@media screen and (max-width:991px){
    .mobile_none{display: none  !important;}
    .pc{display: none  !important;}
    .mobile{display: block  !important;}
    .pc_flex{display: none !important;}
    .mobile_flex{display: flex  !important; }
    .pc-inline{display: none  !important;}
    
    .index-nv, .area-link, .deco-num, #index .sect02{display: none}
    #gnb li{min-width: 120px}
    #hd .w-base{padding:0 20px}
    .menu-nav .tb-areaset{padding:0 0 0 50px}
    .menu-nav .tb-areaset ul a{font-size:2em}
    .hori-type{position: relative;width: 100%;overflow: hidden;overflow-x: auto;-webkit-overflow-scrolling: touch;white-space: nowrap;}
    .hori-type li{float: none !important;width: auto;display: inline-block}

    .icon-prugio-type02{width:250px;margin-top:-5px;background-size: 100% auto;background-repeat: no-repeat}
    .icon-deco-cc04{width:200px;height:170px;background-size: 100% auto;background-repeat: no-repeat}

    .photo-slider .slick-list{padding:0 0 0 0 !important}
    .pg-home .slider-area{padding:0 20px !important}
    .photo-slider .slick-slide{padding:0;margin:0}
    .photo-slider .i2{top:37%;left:5%;width:90%;z-index: 999}

    .photo-slider .i1{width:100%}
    .photo-slider .info-box{position: relative;top:-8px;left:auto;right:0;padding:30px;width:auto;-webkit-transform:none;transform: none}
    .photo-slider .info-box h4{font-size:20px}
    .photo-slider .info-box h4+p{margin:6px 0 30px;font-size:14px}
    .photo-slider .info-box li{font-size:12px}
    .photo-slider .info-box .tit-area:before{display: none}
    .premium-slider .info-box h4{min-height:auto;padding-bottom:15px}

    .pg-home .sect01,.pg-home .sect03{padding:50px 0}
    .pg-home .sect02{padding:50px 20px}
}

@media screen and (min-width:768px){
  #hd:hover {height:auto;padding-bottom:40px}
  #hd:hover #gnb>li ul{display: block}
}
@media screen and (max-width:768px){
    .m_br {display: block;}
    .m_center {text-align: center;}
    .m_center::before {left:50% !important; transform: translateX(-50%) !important;}
    a.btn_detail {    width: 160px; margin: 0 auto; display: block;} p{font-size:14px}
    .m_flex_center {display: flex;justify-content: center;flex-wrap: wrap;}
    #hd:hover{/*background:none*/}
    .if-scroll #hd:hover{background:#fff}
    #gnb, .life-slider-inven, .cal-box .cal-header button .cal_info{display: none}
    body,input,textarea,select,button,table{ font-size:13px;}
    .menu-btn ,.hidden-sm{display: block}
    .line-tab{padding-bottom:0 !important}
    section h3 a{border-bottom:1px solid #222}
    .con-area{min-height:auto;padding:0 20px 40px}
    .w-base{padding:0}
    .btn-contact, .if-scroll .btn-contact{height:59px;line-height:56px;}
    .w100-xs{width:100% !important}
    .ani-stop{visibility:visible}
    .px-sect .animated{-webkit-animation:none !important;animation:none !important}
    .dot-control{bottom:340px}
    .slick-dots button{width:24px;font-size:13px}
    [class^=icon-arrow]{margin-top:-2px}
    .icon-userplus{width: 15px;height: 16px;background-size: 85% auto;background-repeat: no-repeat;position: absolute;top: 11px;right: 6px;}
    .icon-logo-wh{width:70px;height:25px}
    .icon-prugio-type{width:300px;height:62px;margin-top:-5px;background-repeat: no-repeat;background-size:100% auto}
    .icon-symbol-wh{width:45px;height:54px;background-size:100% auto}
    .icon-close{right:17px;background-size:18px auto;background-repeat: no-repeat}
    [class^=icon-contact]{width:60px;height:60px;background-size: 100% auto}

    .btn-view-small:before{content:'';top:8px;right:-18px;width:10px}
    .btn-wide{font-size:18px}
    .btn-lg, .btn-lg:hover{padding:13px 0;font-size:12px}

    .txt-ref{bottom:15px;left:20px;font-size:11px}
    .txt-ref-img{top:15px;right:15px;font-size:11px}
    .txt-ref-box{margin-top:0;padding:10px 15px;font-size:11px;line-height: 1.3}
    .txt-ref-box li+li{margin-top:8px}

    .slide-pt .slick-track{position: relative;overflow: hidden;overflow-x: auto;-webkit-overflow-scrolling: touch;white-space: nowrap}
    .photo-slider .arrow-area{bottom:0}
    .photo-slider .slick-track{padding-bottom:30px !important}

    .nav-tabs{padding-bottom:10px}
    .nav-tabs>li>a{min-width:78px;font-size:14px;line-height: 1}
    .nav-tabs>li>a, .nav-tabs>li>a:focus, .nav-tabs>li>a:hover{margin:0 0 0 -4px}
    .nav-tabs.hori-type{padding-left:20px}

    #hd{height:55px;/*overflow: auto;*/ overflow: hidden;}
    #hd h1{margin:8px 0 0 20px}
    .icon-hd-logo{width:120px}
    .menu-btn{position: relative;top:0;float:right;margin-top:27px;width:30px}
    .menu-btn:before, .menu-btn:after{height:3px}
    .menu-nav{width:100%}
    .menu-nav .tb-areaset{padding:0 0 0 30px}
    .menu-nav .tb-areaset ul a{font-size:1.7em;color:#000}
    .menu-nav .tb-areaset ul a span{font-size:1em;opacity: .3}
    .menu-nav .tb-areaset ul a em{opacity: 1}
    .menu-nav .tb-areaset em{padding-left:10px}
    .menu-nav .tb-areaset em:before{width:3px;height:3px}
    .menu-nav .call{right:auto;left:0;font-size:15px}
    .menu-nav .call a{font-size:28px}

    #index .main-slider{margin-top:50px}
    #index .main-slider li{height:auto}
    .main-slider.sub li{padding:75px 0 45px}
    .main-slider li p{font-size:20px}
    .main-slider li.i1{background-image:url(../img/slide_m.jpg);}
    .main-slider li.i2{background-image:url(../img/slide_m2.jpg);}
    .main-visual{padding:33px 0 !important}
    .slider__counter{right:110px;font-size:40px}
    .slider__counter .total{font-size:30px}
    .slider__counter .here{margin:-30px 0 0 -21px;}
    .main-slider .slick-arrow{width:40px;height:40px;background-size:auto 100%}
    .main-slider .slick-prev{margin-left:-50px}
    .main-slider .slick-next{margin-right:-50px}

    .detial-search .btn-primary{width:100%;margin-top:10px}

    .type-info-box{margin-top:10px;width:90%;padding:15px 0;margin-left:5%}
    .type-info-box>div{font-size:16px}
    .type-info-box>div:first-child{font-size:20px}

    #index section h3{font-size:24px}
    #index .sect01 h3+p{margin-top:30px}
    #index .sect01 h3:before{bottom:-20px}
    #index #px1{margin-top:0;padding:20px 0 30px}
    #index .sect01 h3:before{right:auto;left:0}
    #index .sect01 h3+p{font-size:12px}
    #index .sect01 h3{margin-top:0}
    #index .sect02>div{height:250px}
    #index .sect03 h3, .life-slider-area{padding:0 20px !important}
    #index .sect04, .sect-info{padding:40px 20px 40px}
    #index .sect04 .tit-area span b{font-size:40px}
    #index .sect04 h3+p{font-size:13px}
    #index .sect04 h3+p:before{bottom:-15px}
    #index .sect03{padding:40px 0}

    .main-slider.sub{display: table;width:100%;height:120px;margin-top:55px}
    .main-slider.sub li{display: table-cell;vertical-align: middle;padding:0}
    .life-slider{margin-top:15px}
    .life-slider-area{width:100% !important}
    .life-inven-area{margin-right:0}
    .showroom_slide{width:100%}
    .area-info{right:20px}
    .area-info h4{margin-bottom: 13px}
    #index .sect04 .tit-area, .box-nav{position: relative;top:auto;bottom:auto}
    .box-nav{margin-top:35px}
    .deco-squ{top:0%}
    .area-info{position: relative;right:0;width:100%;margin-top:10px;padding:20px 0 0 0;text-align: left}
    .area-info h4{font-size:25px;}
    .area-info h4:before{right:auto;left:0;width:100%}
    .area-info li{padding:10px 0}
    .area-info h5{font-size:15px}
    .area-info h5+p{font-size:13px}

    .life-slider .num{font-size:45px}
    .life-slider .num:before{bottom:-17px;left:-135px}
    .life-slider .s-info{margin:-110px 20px 0 20px}
    .life-slider .s-info h4{font-size:18px}
    .life-slider .s-info h4+p{font-size:11px}
    .life-slider-inven .s-info h4{font-size:15px}
    .life-slider-inven .s-info {left:5px;bottom:35px;}
    .life-slider-inven li{margin-right:15px;padding-bottom:25px}
    .life-slider .slick-arrow{top:50%;width:35px;height:35px;margin-top:-70px;left:-15px;background-size:auto 100%}
    .life-slider .slick-next{right:-15px;left:auto}

    .sect-info{font-size:16px}

    .down-box{position: relative;margin:0;right:auto;padding:40px 25px}

    .iso-box{height:auto;margin-top:0;padding:30px 0}
    .iso-box span{float:none;width:100%;padding:0 20px}
    .int-area{margin-top:0}

    .location-info{padding:20px;}
    .location-info .titarea p:first-child{font-size:16px}
    .pg-ecopark .sect01{height:300px;padding:80px 0 0 0 !important;background-size:auto 100%;font-size:18px;}
    .pg-ecopark .sect01 b{font-size:26px}
    .prugio-box+div{display: none}
    .prugio-box-type{padding:15px}
    .prugio-box-type, .prugio-box-type>div{width:100%}
    .prugio-box-type>div>div{padding:6px 0}
    .prugio-box-type>div>div:first-child, .prugio-box-type>div>div{font-size:12px}
    .sub-p .pg-ecopark section:not(#px0){padding:40px 20px}
    .sub-p h3{font-size:24px;margin-top:40px !important}

    .tb-area-info{margin-top:20px}
    .tb-area-info tr td b, .tb-area-info{font-size:12px}
    .tb-area-info tr th{padding:5px 0;font-size:11px}

    .flow-sect.sub02 a{width:80%;padding:20px 0}
    .flow-sect.sub02 a h4{font-size:20px}
    .flow-sect.sub02 a span{margin-top:10px}

    .cal-box .cal-header button{min-width:auto;height:52px;padding:0 20px}
    .cal-box .cal-header button.cal_next{padding-left:40px;background-size:30px auto}
    .cal-box .cal-header button.cal_prev{padding-right:40px;background-size:30px auto}
    .cal-box .cal_ym h1{font-size:33px}
    .cal-box .cal_ym h2{font-size:15px}
    .cal-box .cal-header button .btn_ym h1{font-size:20px}
    .cal-box .cal-header button .btn_ym h2{font-size:11px}

    .pg-home .sect02 .i-left, .pg-home .sect02 .i-right{margin-left:0;margin-right:0}
    .pg-valuable .sect01{padding:80px 0}
    .tb-type.direct{margin-top:0}

    .pic-set .pr{height:300px}
    .pic-set .cover{top:0;padding-top:90px}
    .pic-set .cover i{font-size:40px}
    .pic-set .cover h4{font-size:17px}
    .pic-set .cover p{padding-top:20px}
    .flow-sect a{width:80%}
    .flow-sect a h4{font-size:15px}

    .pagination>li>a, .pagination>li>span{min-width: auto;height:auto}

    .modal-dialog{margin:10px 20px}
    .modal-header{padding:30px 20px 10px;font-size:20px;background-position:88% 100%}
    .modal-body{padding:20px 20px}
    .modal-body label{font-size:14px}
    .modal-title{font-size:20px}
    .modal-header .close{right:0;width:45px;height:45px;background-size:100% auto}
    .form-control{height:44px}
    .t-box{padding:10px;min-height:80px;font-size:12px}
    .step-area li+li{padding-top:40px}
    .step-area li+li:before{top:20px;left:50%;width:15px;margin-left:-7px;background-size: 100% auto;background-position: 50% 50%;background-repeat: no-repeat;transform: rotate(90deg );-webkit-transform: rotate(90deg );}
    .step-area b{font-size:18px}
    .step-area p{font-size:12px}
    .pg-contact .sect02{margin-top:40px}
    .pg-ecopark .sect04 .map-rea em{display: none}

    #ft .icon-logo-wh{position: relative;margin-bottom:20px}
    .fixebox-user{padding:10px 20px;font-size:11px}
    .fixebox-user .tb-type{table-layout: fixed;padding:10px 15px}
    .fixebox-user .tb-type>div{width:100%}
    .fixebox-user .tb-type>div:first-child{width:145%}
    .btn-attent{padding:5px 24px 7px 13px;margin-top:10px;font-size:11px}
    .ft-area{padding:15px 20px 40px}
    .ft-area .tit{padding:8px 0;font-size:13px;}
    .ft-area .copy{font-size:11px;}
    .ft-area .copy span+em{padding-left:12px}
    .ft-area > .row {text-align: center;}
    .box-nav button.tab_showroom{width:70px;height:70px;padding:10px 10px 10px 0;font-size:13px}
    .ft-area .tit{margin-bottom:0}
    .ft-area dt, .ft-area dd, .ft-area .sitemap li{font-size:11px}
    .copyright-p{position: relative;top:auto; margin-top:10px}
    .copyright-p img{width:30%;margin-top:30px}
    .scroll-info{font-size:11px}

    .sub-p h3{font-size:25px}
    .sub_tab li button{font-size:16px}

    .agree_radio{margin:5px 0 0}
    .agree_radio span{float:none !important;display: block !important;text-align: left;margin:15px 0;font-size:13px}
    .pg-reservation .form-control.w30{width:40%}
    .area-pic li{width:50%}
    .area-pic li a{width:95%; background-size: auto 25px;padding:16px 0 16px 45px;font-size:1.2em}
    .pg-reservation .col-12>div li+li a{margin-left:5%}

    .m-w-100, .sub_tab{width:100% !important}
    .pg-reservation .row{margin:0 -10px 30px}
    .pg-reservation h4{font-size:18px !important;padding-bottom: 0 !important}
    .info-box{padding:20px;margin-top:20px}
    .info-box>ul>li{display: block}
    .info-box>ul>li em{width:81px;height:28px;font-size:13px;line-height: 28px;background-size:auto 100%;background-repeat: no-repeat}
    .info-box>ul>li p{margin-top:8px;line-height:1.3em!important;font-size:15px}
    .info-box>ul>li ol li{font-size:13px}
    .pg-reservation .col-5{float:none;width:100%;margin-bottom:20px}
    .pg-reservation .col-5>div{min-height: auto}
    .supercal .supercal-header{font-size:20px}
    .time-pic li a, .data-area{font-size:15px}
    .time-pic li a, .data-area{padding:10px 14px}
    .supercal-month th, .supercal-month td{font-size:13px;padding:13px 0}

    .icon-cal, .icon-time{width:20px;height:20px;margin-top:0}

    .pg-reservation h3{font-size:16px !important}
    .pg-reservation h3:before{width: 4px;height: 4px;margin: 6px 0 0 -10px;}
    .terms-box{height:150px;font-size:12px}
    .ag-area{display: block;font-size:13px;text-align: right}
    .ag-area span{display: inline-block;padding:15px 0;float: right}

    .user-info .table th, .user-info .table td{font-size:14px;line-height: 20px}
    .user-info .table td{padding-left:20px}
    .pg-reservation .form-control{font-size:15px;padding: 10px}
    .user-info .table td select, .user-info .table td input[type='tel']{width:30%;line-height: 20px}
    .user-info .table td span{line-height: 47px}
    .pg-reservation .btn-area button{width:100%;padding:15px 45px;font-size:18px;}
}

@media screen and (max-height:690px){
    .index-nv{top:450px;margin-left:-1065px}
    .fix-snb .index-nv{top:350px}
    .index-nv li+li{margin-left:50px}
}