@charset "utf-8";

/* common */
* {box-sizing:border-box; vertical-align:top;}
body{overflow-x:hidden;}
::selection{background:#e0cd9a; color:#fff;}
::-moz-selection{background:#e0cd9a; color:#fff;}
body{font-size:16px; word-break:keep-all;}
th[data-view="file"] + td ul li a{line-height:1em;}
.arita{font-family:'AritaBuri';}
.wrap{width:1280px; margin:0 auto;}
a.btn_basic{display:inline-block; position:relative; width:178px; line-height:1; padding:24px 10px; background:transparent; border:3px solid #fff; font-size:15px; color:#fff; text-align:center; letter-spacing:-0.01em; transition:all 0.3s ease 0s; vertical-align:middle; cursor:pointer; border-radius:100px;}
.btn_basic{position:relative; font-weight:600;}
.btn_basic .arrow{position:relative; padding-right:0; transition:all 0.3s ease 0s;}
.btn_basic .arrow:after{content:""; display:block; position:absolute; opacity:0; top:3px; right:0; width:6px; height:11px; background-position:50% 50%; transition:all 0.2s ease 0s; background-image:url('../../images/common/arr_basic_point.svg'); background-repeat:no-repeat;}
.btn_basic:hover{background:#fff; color:#1f2c5c;}
.btn_basic:hover .arrow{margin-left:-15px; padding-right:15px; color:#ad7c62;}
.btn_basic:hover .arrow:after{opacity:1; right:-15px;}
a.btn_basic.color{border-color:#d6d6d6;}
a.btn_basic.color .arrow{color:#333;}
.btn_basic.color .arrow:after{background-image:url(../../images/common/arr_basic_color.svg);}

/* animation */
.ani{position:relative; opacity:0; transition:all 0.8s ease-out 0s; transform:translate(0,20px);}
.ani.is-animate{opacity:1; transform:translate(0,0);}
.delay-100{transition-delay:100ms;}
.delay-150{transition-delay:150ms;}
.delay-200{transition-delay:200ms;}
.delay-250{transition-delay:250ms;}
.delay-300{transition-delay:300ms;}
.delay-350{transition-delay:350ms;}
.delay-400{transition-delay:400ms;}
.delay-450{transition-delay:450ms;}
.delay-500{transition-delay:500ms;}

/* popup */
.layerPop{overflow:hidden; border:1px solid #353535; border-radius:14px; z-index:10;}
.layerPop .btn button{font-size:13px;}
.layerPop .btn{padding:13px 10px; background:#353535; text-align:left;}
.layerPop .btn button:last-child{float:right; margin:0 12px 0 0;}

/* header */
#header{position:fixed; z-index:10; top:0; width:100%;}
h1.logo{position:absolute; font-size:20px;}
#header h1.logo{top:40px; left:50px;}
h1.logo a{display:block; color:#fff; transition:0.5s;}

.fp-viewing-ABOUT #header h1 a,
.fp-viewing-GALLERY #header h1 a,
.fp-viewing-CONTACT #header h1 a,
.fp-viewing-6 #header h1 a{color:#333; transition:0.5s;}

#header .btn_menu{position:absolute; top:50%; left:50%; z-index:91; width:34px; height:34px; margin-top:-12px; margin-left:-12px; font-size:0px;transition:all 0.3s ease 0s;}
#header .btn_menu > span{display:block;position:absolute;left:0px;width:100%;height:2px; background:#fff;}

.fp-viewing-ABOUT .btn_menu > span,
.fp-viewing-GALLERY .btn_menu > span,
.fp-viewing-CONTACT .btn_menu > span,
.fp-viewing-6 #header .btn_menu > span{background:#333 !important;}

#header .btn_menu > span:nth-of-type(1){top:5px; left:6px; width:28px;}
#header .btn_menu > span:nth-of-type(2){top:40%; width:34px; transition:background 0.3s ease 0s;}
#header .btn_menu > span:nth-of-type(3){top:23px; left:14px; width:20px;}
#header .btn_menu > span:nth-of-type(1),
#header .btn_menu > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}
#header .btn_menu.active{transform:rotate(180deg); top:-13px; margin-left:5px;}
#header .btn_menu.active > span{background:#333;}
#header .btn_menu.active > span:nth-of-type(1){top:5px; left:0; transform:rotate(-45deg); width:34px;}
#header .btn_menu.active > span:nth-of-type(2){background:transparent !important;}
#header .btn_menu.active > span:nth-of-type(3){top:5px; left:0; transform:rotate(45deg); width:34px;}
#header .btn_menu.active > span:nth-of-type(1),
#header .btn_menu.active > span:nth-of-type(3){transition-delay:0s, 0.3s;}
#header .btn_close{display:none; position:absolute; top:0px; left:0px; width:30%; height:100%; font-size:0;}
#header nav{position:absolute; opacity:1; right:-500px; width:500px; height:100vh; background:#fff; transition:0.6s ease-in-out 0s;}
#header nav.active:after{content:''; display:block; position:absolute; top:0; right:500px; width:2000px; height:100%; background:rgba(0, 0, 0, 0.3); z-index:-10;}
#header nav.active{opacity:1; visibility:visible; right:0;}
#header nav.active .bot_ob{display:none;}
#header nav .gnb{position:absolute; top:15%; width:100%;}
#header nav .gnb > li{position:relative; padding:0 50px; cursor:pointer;}
#header nav .gnb > li+li{margin-top:10px;}
#header nav .gnb > li > a{display:block; position:relative; width:100%; padding:10px 0; font-size:20px; color:#333;  transition:0.3s ease 0s;}
#header nav .gnb > li > a:before{content:''; display:block; position:absolute; top:17px; right:0; width:16px; height:16px; background:url(/pension/images/icon_next01.png)no-repeat 50% 0; transition:0.3s ease 0s; opacity:0.6;}
#header nav .gnb > li:hover a{color:#e0cd9a;}
#header nav .gnb > li:hover a:before{background:url(/pension/images/icon_next02.png)no-repeat 50% 0; opacity:1;}
#header .menu_fix{position:absolute; top:53px; right:72px; z-index:999; transition:left 2s ease-in-out 0s, background 0.5s ease 0s;}
#header .menu_fix.hideMenu{left:-100%;}
/*
#header *[data-layout-menu="white"]{background:red;}
#header *[data-layout-menu="black"]{background:rgba(0,0,0,0.16);}
#header *[data-layout-menu="black"] > .btn_menu > span{background:rgba(255, 255, 255, 0.43);}
#header *[data-layout-menu="black"] em{color:#fff;}
*/

.bot_ob{position:fixed; right:50px; bottom:40px; transform:rotate(90deg) !important; transform-origin:right; z-index:1; transition:0.5s;}
.bot_ob h2{color:#fff;}
.fp-viewing-HOME .bot_ob, .fp-viewing-ROOM .bot_ob{opacity:0; transition:0.5s;}
.fp-viewing-ABOUT .bot_ob h2,
.fp-viewing-GALLERY .bot_ob h2,
.fp-viewing-CONTACT .bot_ob h2,
.fp-viewing-6 .bot_ob h2{color:#333; transition:0.5s;}
.fp-viewing-6 .bot_ob{opacity:0;}

.contact_info{position:absolute; padding:50px; bottom:0; background:#e0cd9a; width:100%;}
.contact_info ul{padding-left:20px; border-left:3px solid #fff;}
.contact_info ul li{color:#fff;}
.contact_info ul li+li{margin-top:12px;}
.contact_info ul li > h3{display:inline-block; width:100px;}
.contact_info ul li span{display:inline-block;}
.contact_info ul li span h3{font-weight:normal;}



/* footer */
#section6{background:#333 !important; height:auto !important;}
#section6 .inr{position:relative;}
#section6 .fp-tableCell{height:auto !important;}
.footer_wrap{padding:45px 0;}
.footer_wrap .logo{right:0; top:50%; transform:translateY(-50%); color:#fff; opacity:0.3;}
.footer_wrap .f_top ul{font-size:0;}
.footer_wrap .f_top ul li{display:inline-block;}
.footer_wrap .f_top ul li a{display:block; margin-right:25px; color:#aaa; font-size:14px; transition:0.2s;}
.footer_wrap .f_top ul li a:hover{color:#eee;}
.footer_wrap .f_bottom{margin:40px 0;}
.footer_wrap .f_bottom span{display:inline-block; margin-right:25px; font-size:14px; color:#aaa;}
.footer_wrap .f_bottom span em{margin-right:8px; color:#eee; font-weight:600;}
.footer_wrap .copy{font-size:12px; text-transform:uppercase; color:#888;}
.footer_wrap .copy em{color:#eee;}



@media screen and (max-width:1680px){
    #header h1.logo{top:20px; left:20px;}
    #header .menu_fix{top:35px; right:52px;}
    #fp-nav.fp-right{left:20px !important;}
    
    .bot_ob{right:30px; bottom:20px;}
}

@media screen and (max-width:1024px){
    .bot_ob{display:none;}
}

@media screen and (max-width:767px){
    h1.logo{font-size:16px;}
    
    #header nav{right:-100%; width:90%;}
    #header nav .gnb > li{padding:0 20px;}
    
    .footer_wrap{text-align:center;}
    .footer_wrap .logo{display:none;}
    .footer_wrap .f_bottom span{font-size:12px;}
    
    .contact_info{padding:40px 20px;}
    nav .contact_info ul{padding-left:0; border-left:0;}
    nav .contact_info ul li h3{font-size:16px;}
}

@media screen and (max-width:420px){
    #header nav{width:100%;}
}