@charset "utf-8";

/** 헤더, 푸터 공통 CSS **/
/***************** Header *****************/
.header												{ position:relative; width:100%; border-bottom:1px solid #d8d8d8; background:#fff; z-index:101; transition:.5s; }
.header .con_inner								{ position:relative; }
.header .head_body > .con_inner				{ align-items:center; padding:3.7rem 0 1.3rem;}
.header .head_etc									{ align-items:center; gap:.5rem; position:absolute; right:0; top:.6rem; font-size:1.02rem;}
.header .head_etc > li ~ li						{ position:relative; padding-left:.8rem;}
.header .head_etc > li ~ li::before				{ position:absolute; left:0; top:50%; width:.1rem; height:1rem; background:#d8d8d8; transform:translateY(-50%); content:""; }
/*.header .head_body .logo						{ width:277px; height:31px; background:url(/resources/jns-img/common/bg_logo.png) no-repeat 0 0 / 100%}*/
.header .head_body .logo a					{ display:flex; align-items:center; height:100%; gap: .2em; }
.header .head_body .logo_img        { width: 120px; }
.header .head_body .logo_text       { display:flex; font-size:.95em; letter-spacing: -.04em; padding-bottom:5px;}
.header .head_body .logo_text span  { animation: wave 2s ease-in-out; animation-iteration-count: infinite; font-size:1.5rem; font-weight:800; color:#014693;}


@keyframes wave { 15%, 30%, 100% {transform: translateY(0);}  20%, 60%{transform: translateY(-4px);} }

.header .head_body .logo_text span:nth-child(1) {animation-delay: 0.1s;}
.header .head_body .logo_text span:nth-child(2) {animation-delay: 0.13s;}
.header .head_body .logo_text span:nth-child(3) {animation-delay: 0.16s;}
.header .head_body .logo_text span:nth-child(4) {animation-delay: 0.19s;}
.header .head_body .logo_text span:nth-child(5) { padding-left:0.2rem; animation-delay: 0.22s;}
.header .head_body .logo_text span:nth-child(6) {animation-delay: 0.25s;}
.header .head_body .logo_text span:nth-child(7) {animation-delay: 0.28s;}
.header .head_body .logo_text span:nth-child(8) {animation-delay: 0.31s;}
.header .head_body .logo_text span:nth-child(9) {animation-delay: 0.34s;}
.header .head_body .logo_text span:nth-child(10) {animation-delay: 0.37s;}
.header .head_body .logo_text span:nth-child(11) {animation-delay: 0.40s;}




.header .head_body .right						{ flex-direction:column; gap:2.4rem; align-items:flex-end; margin-left:auto; }
.header .head_body .btn-navi-wrap			{ gap:1.2rem; align-items:center;}
.header .goog-te-gadget-simple				{ padding:.5em; font-size:14px; color:#787978; border:1px solid #d1d1d1; border-radius:2em}

.btn-navi												{ align-items:center; gap:.5rem; padding:.8rem .4rem; color:#222; font-weight:700; border-radius:.6rem;  transition:.2s; }
.btn-navi::before									{ content:""; width:1.65rem; height:1.1rem; background:url(/resources/jns-img/common/img_allmenu.svg) no-repeat 0 2px;}
.btn-navi:hover										{ background:#edf1f5;}
.all::before											{ background-image:url(/resources/jns-img/common/img_allmenu.svg);}
.header .srch_wrap .btn							{ display:none;}
.form_inner											{ justify-content:space-between;align-items:center; width:20rem; padding:.65em 1em; overflow:hidden; color:#636363; background:#f8f8fa; border-radius:2em; }
.form_inner input									{ width:calc(100% - 3rem); padding:.2em; background:transparent; border:0;}
.form_inner button img							{ width:1.5rem;}

.header .nav						{ border-top:1px solid #d8d8d8; background:#fff;}

.nav									{ height:63px; position:relative; }
.nav_bg								{ position:absolute; top:63px; left:0; width:100%; height:auto; background:#edf1f5; }
.nav_dimm							{ background:#000; display:none; height:100%; left:0; opacity:.5; position:fixed; top:0; width:100%; z-index:99; }

.nav > ul								{ font-size:0; text-align:left; }
.nav > ul > li						{ display:inline-block; height:63px; margin-right:10px; vertical-align:top; }
.nav > ul > li > a					{ display:block; padding:0 2.7em 0 2em; height:100%; color:#222; font-size:1.27rem; font-weight:700; letter-spacing:-.03em; line-height:60px; background:url("/resources/jns-img/common/bg_gnb_arrow_d.png") center right 20px / 16px auto no-repeat; }
.nav > ul > li > a.on				{ background:url("/resources/jns-img/common/bg_gnb_arrow_u.png") center right 20px / 16px auto no-repeat #cdd7e4; color:#1d1d1d; }

.nav .sub_menu					{ display:none; position:absolute; top:63px; left:0; width:100%; background:#edf1f5; }
.nav .sub_menu_t					{ position:relative; height:96px; border-bottom:1px solid #393B44; }
.nav .sub_menu_t > a			{ position:absolute; top:50%; left:0; padding-right:1.2em; font-size:25px; font-weight:700; letter-spacing:-.03em; }
.nav .sub_menu_t > a::before	{ position:absolute; right:0; top:.2em; width:1em; height:1em; border-radius:50%; content:""; background:rgb(38,168,117);
    background:-moz-linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    background:-webkit-linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    background:linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#26a875",endColorstr="#01559b",GradientType=1); }
.nav .sub_menu_t > a::after		{ position:absolute; right:.4em; top:.55em; width:8px; height:8px; border:solid #fff; border-width:2px 2px 0 0; transform:rotate(45deg); -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); content:""}
.nav .sub_menu_b									{ padding:30px 0 70px; }
.nav .sub_menu_b > ul							{ margin-top:-40px; }
.nav .sub_menu_b > ul > li						{ margin-top:40px; width:20%; }
.nav .sub_menu_b > ul > li > a				{ position:relative; color:#3f3f3f; font-size:17.5px; font-weight:500; padding-left:12px; letter-spacing:-.03em; }
.nav .sub_menu_b > ul > li > a:hover		{ color:var(--blue); }
.nav .sub_menu_b > ul > li > a:after			{ position:absolute; width:calc(100% - 12px); height:2px; bottom:0; left:12px; -webkit-transform:scaleX(0); transform:scaleX(0); background:var(--blue); -webkit-transition:transform .3s; transition:transform .3s; content:""; }
.nav .sub_menu_b > ul > li > a:hover:after	{ -webkit-transform:scaleX(1); transform:scaleX(1); }
.nav .sub_menu_b > ul > li > a:before		{ content:"･"; left:0; position:absolute; top:3px; }
.nav .sub_menu_b .sub_menu_dep3			{ margin-top:.5rem;}
.nav .sub_menu_b .sub_menu_dep3 a		{ position:relative; display:block; padding:.3em 0 .3em 12px; color:#848484; font-size:16px; letter-spacing:-.03em; }


/* 모바일 GNB */
.header .m-gnb-wrap							{ display:none; position:fixed; top:0; right:-100%; width:100%; max-width:450px; height:100%; background:#fff; transition:right ease 0.3s 0.15s;}
.header .m-gnb-wrap .m-gnb-in				{ display:flex; flex-direction:column; height:100%;}
.header .m-gnb-in .m-gnb-top-etc			{ padding:1.2rem 1rem;background:#fff; border-bottom:1px solid #d8d8d8;}
.header .m-gnb-top-etc .head_etc			{ position:relative; top:0; left:0; letter-spacing:-.03em; color:#777}
.header .m-gnb-in .m-gnb-body				{ flex:1; background:#edf1f5;position:relative;}
.header .m-gnb-menu .topmenu_all>li>a	{ display:flex;align-items:center;font-size:1.3rem;font-weight:700;width:11rem; height:4rem;letter-spacing:-.04em; border-bottom:1px solid #d8d8d8;padding:0 1.5rem;}
.header .m-gnb-menu .topmenu_all > li.active>a			{ color:#fff; background:rgb(38,168,117);
    background:-moz-linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    background:-webkit-linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    background:linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#26a875",endColorstr="#01559b",GradientType=1); }
.header .m-gnb-menu .topmenu_all > li.active .submenu { display:block}
.header .m-gnb-menu .topmenu_all>li .submenu { position:absolute; right:0; top:0; width:calc(100% - 11rem); height:100%; min-height:100%; background:#fff; display:none; padding:.4rem 1.6rem;overflow-y:scroll;scroll-behavior:smooth;}
.header .submenu>ul>li							{ border-bottom:1px solid #ddd}
.header .submenu>ul>li>a						{ display:block; padding:1rem 0; font-size:1.12rem; letter-spacing:-.03em; font-weight:500;}
.header .submenu .lnb-detail					{ padding-bottom:.8em;}
.header .submenu .lnb-detail-item a			{ display:block; padding:.4em 0; font-size:1.05rem; color:#777; letter-spacing:-.03em; }
.header .m-gnb-wrap::after						{ content:"";display:block;background:rgba(0,0,0,0.5);position:fixed;left:0;top:0;right:0;bottom:0;z-index:-1;opacity:0;visibility:hidden;transition:0.2s;}
.header .m-gnb-wrap .btn_close				{ position:absolute; right:4%; top:1rem; }
.header .btn_close									{ width:24px; height:24px; background:url(/resources/jns-img/common/icon_close.svg) no-repeat 50% 50%}

/* 모바일 GNB */
@media (max-width: 1024px) {
    #header .head_body > .con_inner				{ padding:.6rem 0; }
    #header .head_body .btn-navi.all					{ flex-direction:column; gap:.25rem; font-size:.92rem; letter-spacing:-.04em; line-height:1;}
    #header .head_body .btn-navi.all::before		{ height:23px; background-position-y:2px}
    #header .head-gnb { display:none; }
    #header .m-gnb-wrap { display:block; }
    #header .m-gnb-wrap.active { right:0; }
    #header .m-gnb-wrap.active::after { opacity:1; visibility:visible; }
    .header .srch_wrap { left:0; top:0; right:0; }
    .header .srch_wrap .form_inner { width: calc(100% - 5rem); border-radius:1rem; }
    .header .srch_wrap .btn { display:flex; flex-direction:column; align-items:center; gap:.3rem;}
    .header .srch_wrap .btn.open .pad { font-size:.92rem; font-weight:700; letter-spacing:-.04em; color:#222; line-height:1; }
    .header .srch_wrap .btn.open img		{ width:24px; height:24px}
    .header .srch_wrap .srch { display:none; padding:1.3rem 0 1rem 1rem; box-shadow:0 0 1rem rgba(0,0,0,.3); background:#fff; visibility:hidden; overflow:hidden; width:0; height:0; opacity:0; }
    .header .srch_wrap.on{position:fixed;z-index:5; height:83px;}
    .header .srch_wrap.on .srch { display:block; visibility:visible; overflow:visible; height:100%; opacity:1; width:100vw; }
    .header .srch_wrap.on .btn.open { display:none; }
    .header .srch_wrap.on .btn_close { display: block; height:3rem; position:absolute; top: 50%; transform: translateY(-50%); }
    .header .srch_wrap .btn_close { right:1rem; z-index:1; width:3.5rem; border:1px solid #ddd; border-radius:5px; text-align:center; display:none; }
}
@media (max-width: 500px) {
    .header .head_body .logo_img                                { width:100px; }
    .header .head_body .logo_text span                          { font-size:1.4rem; }
    .btn-navi													{ padding:.5rem .2rem}
    .header .head_body .btn-navi-wrap				{ gap:.2rem}
    #header .head_body .btn-navi.all,
    .header .srch_wrap .btn.open .pad				{ font-size:.9rem; letter-spacing:-.04em;}
    .header .srch_wrap.on .srch							{ padding-top:1rem;}
    .header .srch_wrap.on								{ height:70px;}
}
@media (max-width: 400px) {
    .header .head_body .logo_img img                { vertical-align:middle; }
    .header .head_body .logo_text                   { display:none; }
    #header .head_body .btn-navi.all,
    .header .srch_wrap .btn.open .pad				{ font-size:.85rem;}

}



/***************** Footer *****************/
#footer													{ color:#fff; background:#393B44;}
#footer .family_link									{ position:relative; background:#2c3039; }
#footer .family_link .group							{ position:relative; width:50%; border-left:1px solid rgba(255,255,255,.2);}
#footer .family_link li:last-child						{ border-right:1px solid rgba(255,255,255,.2);}
#footer .family_link .label							{ display:block; position:relative; width:100%; padding:1.2em; font-size:1.15rem; text-align:left;}
#footer .family_link .label:hover					{ background:#222; transition:.2s;}
#footer .family_link .label::after					{ position:absolute; width:9px; height:9px; top:2rem; right:1.8rem; border:solid #ddd; border-width:1px 0 0 1px; color:#bcc3c9; transform:rotate(45deg); -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transition:0.2s; content:""}
#footer .family_link .active .label::after							{ top:1.8rem; transform:rotate(225deg);}
#footer .family_link .active .list										{ visibility:visible; width:auto; height:18rem; overflow:auto; opacity:1; transition:all 0.2s; }
#footer .family_link .active .list::-webkit-scrollbar-track		{ background-color:#f5f5f5;}
#footer .family_link .active .list::-webkit-scrollbar				{ width:.8rem;}
#footer .family_link .active .list::-webkit-scrollbar-thumb	{ background-color:#999;}
#footer .family_link .list								{ visibility:hidden; opacity:0; position:absolute; left:0; bottom:100%; overflow:hidden; height:0; width:100% !important; background:#fff; color:#333; border:1px solid #ddd; border-bottom:0; z-index:1; }
#footer .family_link .list a							{ display:block; padding:.4em 1em; font-size:1rem; line-height:1.5; letter-spacing:-.04em; transition:.2s;}
#footer .family_link .list a:hover					{ background:#e5e5e5; text-decoration:underline;}

#footer .footer_cnt									{ position:relative; padding:4rem 0}
#footer .f_logo											{ margin-bottom:1.5rem;}
#footer .footer_info									{ position:relative; font-size:1.02rem; letter-spacing:-.04em;}
#footer .footer_info address						{ font-weight:300; line-height:1.6;}
#footer .footer_info .call								{ margin-top:.5em; padding-left:1em; font-size:1.2rem; letter-spacing:-.04em; background:url(/resources/jns-img/common/icon_phone.svg) no-repeat 0 50% / 12px }

#footer .util										{ position:absolute; right:0; top:0; text-align:right;}
#footer .util .link_list li						{ margin-bottom:.2em; }
#footer .util .link_list li a						{ display:inline-block; position:relative; padding-right:.7em;}
#footer .util .link_list li a::after				{ position:absolute; right:0; top:.45em; width:6px; height:6px; border:solid #c7c7c7; border-width:1px 1px 0 0; transform:rotate(45deg); -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); content:""}
#footer .util .link_sns 							{ align-items:center; gap:.5em; margin-top:1.2em;}
#footer .util .link_sns .social_link			{ display:flex; align-items:center; justify-content:center; width:36px; height:36px; background:#fff; border-radius:50%}
#footer .util .link_sns .social_link img		{ width:48%}

#footer .footer_bottom						{ margin-top:2rem;}
#footer .fnb										{ margin-bottom:1.5rem;}
#footer .fnb li									{ display:inline;}
#footer .fnb li+li::before						{ display:inline-block; width:1px; height:1rem; background:#a3a3a3; opacity:.2; margin:0 1em; font-weight:700; vertical-align:middle; content:""; }


@media (max-width: 1280px) {
    #footer .util									{ position:static; width:100%; margin-top:2rem; text-align:left; font-size:.95rem;}
    #footer .util .link_list						{ display:flex; align-items:center; gap:1em}
}
@media (max-width: 1024px) {
    #footer .family_link .con_inner			{ width:100%;}
    #footer .family_link .label				{ padding:1em; font-size:1.05rem; }
    #footer .family_link .group.active .label::after	{ top:1.4rem; }
    #footer .family_link li:first-child		{ border-left:0;}
    #footer .family_link li:last-child			{ border-right:0;}

    #footer .footer_cnt						{ padding:3rem 0}
    #footer .f_logo								{ margin-bottom:1rem;}
    #footer .f_logo>a							{ display:inline-block; width:210px}
    #footer .footer_info address			{ font-size:.95rem;}
    #footer .footer_info .call					{ font-size:1.08rem;}
    #footer .footer_bottom					{ margin-top:1.5rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.3);}
    #footer .fnb									{ margin-bottom:.8rem;}
    #footer .fnb li + li::before				{ margin:0 .7em;}
    #footer .copyright							{ font-size:.9rem; color:#999}
}
@media (max-width: 768px) {
    #footer .family_link .list a				{ font-size:.95rem;}
    #footer .family_link .label				{ font-size:1rem; }
    #footer .family_link .label::after		{ width:7px; height:7px; top:1.6rem; right:1.5rem;}

    #footer .f_logo>a							{ width:170px}
    #footer .footer_info address			{ font-size:.85rem;}
    #footer .fnb									{ font-size:.95rem;}
    #footer .fnb li + li::before				{ margin:0 .5em; }
    #footer .copyright							{ font-size:.8rem; color:#999}
}
@media (max-width: 358px) {
    #footer .family_link .label .m_hd		{ display:none}
    #footer .util .link_list						{ flex-direction:column; align-items:flex-start; gap:.3em }
}


/* 스카이 메뉴 */
.sky_menu										{ position:fixed; right:5rem; bottom:6%; z-index:98; }
.sky_link											{ width:85px; padding:.7rem 0; background:#fff; border-radius:5em; box-shadow:0 0 15px rgba(0,0,0,.3) }
.sky_link li + li									{ border-top:1px solid #ddd;}
.sky_link li a										{ display:block; padding:1.3rem 0; text-align:center; font-size:.93rem; color:#46484a; letter-spacing:-.05em; font-weight:500;}
.sky_link li a:hover,
.sky_link li a:focus								{ text-decoration:underline}
.sky_link li .icon									{ display:inline-block; width:55%}
.sky_link li em									{ display:block; margin-top:.4em; line-height:1;}
.sky_link li .icon_eye							{ display:flex; justify-content:center; position:relative; padding-bottom:9px; background:url(/resources/jns-img/common/bg_sky_lip.png) no-repeat 50% 100% }
.sky_link .eye									{ position:relative; width:15px; height:21px; background:#fff; border:2px solid #333; border-radius:50%; }
.sky_link .pupil									{ position:absolute; top:50%; left:50%; width:7px; height:7px; transform:translate(-50%, -50%); background:#333; border-radius:50%; animation:blink 1s infinite alternate; }
@keyframes blink {
    0% { height:7px; }
    25% { height:4px; }
    75% { height:7px; }
    100% { height:2px; }
}

.sky_menu .chat_btn 						{ width:85px; height:85px; margin-top:1.5rem; line-height:1; background:rgb(38,168,117); border-radius:50%; animation:chatBtn 2s infinite; z-index:4000;
    background:-moz-linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    background:-webkit-linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    background:linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#26a875",endColorstr="#01559b",GradientType=1); }
.sky_menu .chat_btn span				{ display:block; margin-bottom:-.5em; font-size:1.2rem; font-weight:700; color:rgba(11,13,16,.35)}
.sky_menu .chat_btn em					{ color:#fff; font-size:.93rem; font-weight:500; letter-spacing:-.005em; }
.layer_ttalk .layer_ttalk_con		 		{ position:fixed; right:5rem; bottom:-100%; padding:2.5em 1.5em 2em; width:340px; border:1px solid #ccc; border-radius:20px; background:#f5f5f5; box-shadow:0 0 10px rgb(0 0 0 / 30%); transition:.5s;  z-index:5000;}
.layer_ttalk .layer_ttalk_con.on 			{ bottom:50px; }
.layer_ttalk .layer_ttalk_con .tit 			{ text-align:center; font-size:1.35em; font-weight:700; color:rgba(0,0,0,.8); letter-spacing:-.045em}
.layer_ttalk .layer_ttalk_con .txt			{ margin-top:.5em; font-size:.97em; letter-spacing:-.02em; font-weight:300;}
.layer_ttalk .ttalk_list .btn_call			{ text-align:center; }
.layer_ttalk .ttalk_list li					{ position:relative; display:block; margin-top:.5em; border:1px solid; border-radius:8px; }
.layer_ttalk .ttalk_list li>*					{ display:block; width:100%; padding:1rem 1.5rem; padding-left:70px;  }
.layer_ttalk .ttalk_list li .icon				{ display:flex; align-items:center; justify-content:center; position:absolute; left:1.2em; top:50%; width:45px; height:45px; border-radius:50%; transform:translateY(-50%); }
.layer_ttalk .ttalk_list li span				{ display:block; font-size:.9em; font-weight:normal; color:#888; }
.layer_ttalk .ttalk_list .chat				{ background:#fff; border-color:#ccc}
.layer_ttalk .ttalk_list .kakao				{ background:#ffe303; }
.layer_ttalk .ttalk_list .kakao img		{ width:50%}
.layer_ttalk .ttalk_list .btn_call			{ background:#eef5fb; border-color:#006ed2 }
.layer_ttalk .ttalk_list .btn_call .icon	{ background:#fff; }
.layer_ttalk .copy							{ margin-top:.3em; color:#616161; font-size:.9rem; letter-spacing:-.02em; text-align:center;}
#ktalk_quick								{ overflow:hidden; border-radius:50%; }
.layer_ttalk .closed 						{ position:absolute; top:10px; right:10px; width:26px; height:26px; font-size:0; border-radius:50%; background:#333; }
.layer_ttalk .closed:before,
.layer_ttalk .closed:after 					{ position:absolute; left:50%; top:5px; bottom:5px; width:2px; background:#fff; content:""; }
.layer_ttalk .closed:before 				{ transform:translateX(-50%) rotate(45deg); }
.layer_ttalk .closed:after 					{ transform:translateX(-50%) rotate(-45deg); }

@keyframes chatBtn{
    0% {transform:translateY(0)}
    50% {transform:translateY(-10px)}
    0% {transform:translateY(0)}
}
@media (min-width:1025px){
    .sky_link .sky_btn								{ display:none}
}
@media (max-width:1458px){
    .sky_menu										{ right:2rem; }
}
@media (max-width:1024px){
    .sky_menu										{ right:1rem; bottom:2rem;}
    .sky_link_list										{ display:none;}
    .sky_link .sky_btn								{ display:block; position:relative; margin:.3em auto; text-align:center; font-size:.95rem; font-weight:700; letter-spacing:-.02em; color:#2f3031; line-height:1.1;  }
    .sky_link .sky_btn span						{ display:block; }
    .sky_link .sky_btn font						{ font-weight:300; font-size:.9em;}
    .sky_menu .sky_arrow							{ display:inline-block; position:relative; width:25px; height:25px; margin:0 auto; background:rgb(38,168,117); border-radius:50%;
        background:-moz-linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
        background:-webkit-linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);
        background:linear-gradient(300deg, rgba(38,168,117,1) 0%, rgba(1,85,155,1) 100%);}
    .sky_link .sky_btn .sky_arrow:before		{ position:absolute; width:8px; height:8px; top:10px; right:8px; border:solid #fff; border-width:2px 0 0 2px; transform:rotate(45deg); -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transition:0.2s; content:"" }
    .sky_link .sky_btn.on .sky_arrow:before	{ top:7px; transform:rotate(225deg);}

    .layer_ttalk .layer_ttalk_con					{ right:1rem; }
    .layer_ttalk .layer_ttalk_con.on				{ bottom:2rem; }
}
@media (max-width:468px){
    .sky_link									{ width:65px; padding:.5rem 0; }
    .sky_link li a								{ padding:1rem 0; font-size:.88rem; }
    .sky_link .sky_btn						{ font-size:.85rem; }

    .sky_menu								{ bottom:1.5rem; }
    .sky_menu .chat_btn 					{ width:65px; height:65px; margin-top:1rem;}
    .sky_menu .chat_btn span			{ font-size:1.08rem;}
    .sky_menu .chat_btn em				{ display:block; font-size:.8rem; line-height:1;}

    .layer_ttalk .layer_ttalk_con			{ width:94%;  }
    .layer_ttalk .ttalk_list li>*				{ padding:1rem; padding-left:75px }
    .layer_ttalk .ttalk_list li .icon			{ left:1em }
    .layer_ttalk .ttalk_list li a span		{ font-size:.85em }
}