@charset "utf-8"; /* */
/* */
header .top .header-left>li,
header .top .header-right>div,
header #navigation .depth-01-title,
header #navigation .nav-right,
article>section, footer * { transform: rotate(0.04deg); will-change: transform; } 
header #navigation .nav-left-desc,
header #navigation .nav-right { font-family: suitM; } 
header #navigation .nav-left-desc { font-family: suitR; } 
.notice_nuri { display: flex; align-items: center; gap: 5px; width: 100%; background-color: rgb(238, 242, 247); padding-block: 0.2rem; font: 15px suitM; } 
.notice_nuri .flag { width: 25px; height: 25px; background: url("../images/icons/ico_flag.svg") center center / contain no-repeat; } 
.notice_nuri .container { display: flex; align-items: center; gap: 5px; width: 100%; font: 15px 'suitM'; } 
header { font-family: gmarketsansM; } 
header .top, header .bottom { border-bottom: 1px solid #EBEBEB; } 
header .top .header-left>li { border-top: 1px solid rgb(227, 227, 227); border-right: 1px solid rgb(227, 227, 227); border-image: initial; border-bottom: none; border-top-left-radius: 12px; border-top-right-radius: 12px; font-size: 15px; margin-left: -1px; cursor: pointer; } 
header .top .header-left>li>a:focus-visible { color: #fff; border: 1px dashed #fff; border-top-left-radius: 10px; border-top-right-radius: 10px; background-color: var(--main-color); outline: none; } 
header .top .header-left>li.on, .header-left>li:hover { background-color: var(--main-color); border: var(--main-color); color: rgb(255, 255, 255); } 
header .top .header-left>li>a { display: flex; padding: 14px 20px; letter-spacing: -0.5px; } 
header .top .header-right { font-size: 14px; gap: 40px; } 
header .top .header-right>div:has(i) a { display: flex; align-items: flex-end; gap: 10px; } 
header .top .header-right>div { position: relative; font-size: 14px; cursor: pointer; } 
header .top .header-right>div:not(:first-child)::before { position: absolute; content: ""; top: 4px; left: -20px; display: block; width: 1px; height: 13px; background-color: rgb(234, 234, 235); } 
header .bottom { position: relative; align-items: center; } 
header .center { width: 100%; } 
header .left, header .right { width: 25%; } 
header .bottom .left img { width: 125px; height: 90px; } 
header #navigation .depth-01 { align-items: center; width: 100%; height: 100%; overflow: hidden; } 
header #navigation .depth-01>li { display: flex; align-items: center; height: 100%; padding-right: 30px; cursor: pointer; } 
header #navigation .depth-01>li:has(.nav-inner-box.on) { color: var(--main-color); } 
header #navigation .depth-01>li .depth-01-title:after { position: absolute; left: 50%; top: 290%; transform: translateX(-50%); content:''; display: block; width: 5px; height: 5px; border: 1px solid var(--main-color); border-radius: 50%; opacity: 0; } 
header #navigation .depth-01>li:has(.nav-inner-box.on) .depth-01-title:after { opacity: 1; } 
header #navigation .nav-left { position: relative; width: 15%; background-color: rgb(236, 242, 249); padding: 3vw 1.3vw 0 0; } 
header #navigation .nav-left:before,
header #navigation .nav-left:after { position: absolute; content: ''; display: block; } 
header #navigation .nav-left:before { inset: 0; background: #ECF2F9; left: -150%; z-index: -1; } 
header #navigation .nav-left:after { left: 0; bottom: 0; width: 100%; height: 100%; background-position: center 95%; background-size: contain; background-repeat: no-repeat; } 
.depth-menu-1 .nav-left:after { background-image: url(../images/nav/dep1-bg.png); } 
.depth-menu-2 .nav-left:after { background-image: url(../images/nav/dep2-bg.png); } 
.depth-menu-3 .nav-left:after { background-image: url(../images/nav/dep3-bg.png); } 
.depth-menu-4 .nav-left:after { background-image: url(../images/nav/dep4-bg.png); } 
.depth-menu-5 .nav-left:after { background-image: url(../images/nav/dep5-bg.png); } 
.depth-menu-6 .nav-left:after, .depth-menu-7 .nav-left:after { background-image: url(../images/nav/dep6-bg.png); } 
header #navigation .nav-right { display: flex; flex-wrap: wrap; gap: 2.5vw; width: 85%; padding: 2vw 0 2vw 3vw; overflow-y: scroll; } 
header #navigation .depth-01-title { position: relative; font-size: 18px; cursor: pointer; } 
header #navigation .depth-01>li:not(:first-child) .depth-01-title::before { position: absolute; content: ""; display: block; top: -3px; left: -15px; width: 1px; height: 20px; transform: rotate(25deg); background-color: #E9E9E9; pointer-events: none; } 
header #navigation .nav-inner-box { position: absolute; display: flex; top: 96px; left: 0px; width: 100%; height: 500px; cursor: default; color: #000; background-color: #fff; z-index: 9; display: none; } 
header #navigation .nav-inner-box.on { display: flex; } 
header #navigation .nav-left-top { display: flex; flex-direction: column; } 
header #navigation .nav-left-title { width: max-content; font-family: gmarketsansB; font-size: 1.6rem; line-height: 1.3; background-image: linear-gradient(120deg, rgb(0, 155, 151) 20%, rgb(33, 100, 193) 80%); background-clip: text; -webkit-text-fill-color: transparent; } 
header #navigation .nav-left-desc { margin-top: 18px; } 
header #navigation .depth-02 .title { padding: 4px 4px 4px 15px; border-radius: 5px; border: solid 1px #e8ecf4; background-color: #f8f9fb; } 
header #navigation .nav-right .depth-02 { width: calc((100% - 3vw * 4) / 5); } 
header #navigation .nav-right .depth-02 li:not(.title) { position: relative; padding: 1vw 0 0 1.2vw; } 
header #navigation .nav-right .depth-02 li:not(.title):before { position: absolute; top: 8px; left: 10px; content: ''; display: block; width: 1px; height: 100%; background-color: #DBDBDB; } 
header #navigation .nav-right .depth-02 li:hover { color: var(--color-blue01); } 
header #navigation .nav-right .depth-02 li:not(.title):hover:before { background-color: var(--color-blue01); } 
header .right { display: flex; justify-content: flex-end; } 
header .right .hamburger { width: 50px; height: 50px; background: var(--main-color) url(../images/icons/ico_hamburger.svg) no-repeat center / 16px 14px; border-radius: 12px; cursor: pointer; border: none;} 


/* ------------- */
/* intro section */
/* ------------- */
#introSec>div { width: 50%; padding: 0 2vw; } 
#introSec .intro-left-box { background: url(../images/intro-section/mount-bg.png) no-repeat left 120px/contain; padding-top: 70px; } 
#introSec .intro-left-box form { position: relative; border-bottom: 3px solid var(--main-color); height: 50px; } 
#introSec .intro-left-box input { width: 85%; height: 40px; border: none; } 
#introSec .intro-left-box input:focus { outline-width: 3px; } 
#introSec .intro-left-box button { position: absolute; top: -15px; right: 0; width: 60px; height: 60px; border: none; border-radius: 50%; background: var(--main-color) url(../images/icons/sprite-common.png) no-repeat -490px -273px; scale: 0.95; cursor: pointer; } 
#introSec .intro-left-box .inputPlaceHolder { position: absolute; bottom: 10px; font-size: 27px; pointer-events: none; transition: 0.3s; } 
#introSec .intro-left-box .inputPlaceHolder span { font-size: inherit; } 
#introSec .intro-left-box form:focus-within .inputPlaceHolder { opacity: 0; transform: translateY(-10px); transition: 0.3s; } 
#introSec .intro-left-box .form-bottom-text { align-items: center; gap: 1vw; margin-top: 10px; } 
#introSec .intro-left-box .form-bottom-text .pop-search { position: relative; width: 110px; min-width: 88px; height: fit-content; color: #fff; background-color: var(--color-green01); border-radius: 20px; padding: 8px 5px 6px 3px; text-align: center; font-style: italic; } 
#introSec .intro-left-box .form-bottom-text .pop-search:before { position: absolute; top: -7px; left: 15px; content: ''; display: block; width: 10px; height: 10px; background: url(../images/intro-section/balloon-tail.svg) no-repeat center/contain; } 
#introSec .intro-left-box .form-bottom-text .hash { flex-wrap: wrap; gap: 15px; } 
#introSec .intro-left-box .form-bottom-text .hash>li a { border: 1px solid #E8E8E8; border-radius: 24px; padding: 10px 16px 9px; background-color: #fff; cursor: pointer; } 
#introSec .intro-left-box .form-bottom-text .hash>li a:hover { background-color: var(--color-blue02); color: #fff; } 
#introSec .intro-right-box { background: url(../images/intro-section/mayor-pic.png) no-repeat right top/485px auto; padding-top: 34px; } 
#introSec .intro-right-box .intro-text { font-size: 21px; padding-top: 1.5vw } 

#introSec .intro-right-box .intro-text .point { font-size: 38px; font-family: 'gmarketsansB'; padding: 13px 0 36px; } 
#introSec .intro-right-box .radius-box { display: flex; gap: 1vw; margin-bottom: 47px; } 
#introSec .intro-right-box .radius-box>.box a { position: relative; padding: 12px 25px 8px 20px; box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); border-radius: 24px; cursor: pointer; } 
#introSec .intro-right-box .radius-box>.box a:after { position: absolute; top: 50%; right: 15px; transform: translateY(-50%); content: ''; display: block; width: 6px; height: 9px; background: url(../images/intro-section/mayor-btn-arr.png) no-repeat center/contain; } 
#introSec .intro-right-box .radius-box>.box a:hover { background-color: #FAFAFE; text-decoration: underline; text-underline-offset: 3px; } 
#introSec .intro-right-box .bottom-box { display: flex; border-radius: 12px; border: 1px solid #DEDEDE; background-color: #fff; } 
#introSec .intro-right-box .bottom-box>.box { display: flex; flex-direction: column; align-items: center; width: calc((100%)/4); } 
#introSec .intro-right-box .bottom-box>.box:not(:last-child) { border-right: 1px solid #DEDEDE; } 
#introSec .intro-right-box .bottom-box>.box:first-child:hover a { border-top-left-radius: 12px; border-bottom-left-radius: 12px; } 
#introSec .intro-right-box .bottom-box>.box:last-child:hover a { border-top-right-radius: 12px; border-bottom-right-radius: 12px; } 
#introSec .intro-right-box .bottom-box a { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 100%; padding-block: 1vw; } 
#introSec .intro-right-box .bottom-box a:hover { background-color: var(--color-blue02); } 
#introSec .intro-right-box .bottom-box a:hover .text { color: #fff; } 
#introSec .intro-right-box .bottom-box a:hover .ico { filter: brightness(0) invert(1); -webkit-filter: brightness(0) invert(1); } 
#introSec .intro-right-box .bottom-box .text { color: #0A264E; } 
#introSec .intro-right-box .bottom-box .ico { width: 46px; height: 40px; } 
#introSec .intro-right-box .bottom-box>.box:nth-child(1) .ico { background: url(../images/intro-section/mayor1.png) no-repeat center/contain; } 
#introSec .intro-right-box .bottom-box>.box:nth-child(2) .ico { background: url(../images/intro-section/mayor2.png) no-repeat center/contain; } 
#introSec .intro-right-box .bottom-box>.box:nth-child(3) .ico { background: url(../images/intro-section/mayor3.png) no-repeat center/contain; } 
#introSec .intro-right-box .bottom-box>.box:nth-child(4) .ico { background: url(../images/intro-section/mayor4.png) no-repeat center/contain; } 




/* ----------------------------------- */
/* hot-issue, oftenUse, season section */
/* ----------------------------------- */
#hotIssue .tab-panel > li > a { display: flex; flex-direction: row !important; font-size: 1.313rem; } 
#hotIssue .tab-panel > li > a:hover { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 5px; } 
#hotIssue a:hover .text { text-decoration: underline; text-underline-offset: 6px; } 
#hotIssue .text { font-weight: 600; } 
#hotIssue .tab .text { font-size: 21px; } 
#oftenUse .text, #season .text { font-size: 17px; } 
:is(#hotIssue, #oftenUse, #season) [role="tablist"] { margin-left: 20px; } 
:is(#hotIssue, #oftenUse, #season) .tab-panel { border: 1px solid rgb(236, 236, 236); border-radius: 12px; padding: 35px 20px; justify-content: space-evenly; gap: 50px; } 
:is(#hotIssue, #oftenUse, #season) .tab-panel>li>a { flex-direction: column; align-items: center; } 
#notice { display: flex; flex-wrap: wrap; margin-top: 50px; gap: 45px; } 
#notice > div { position: relative; width: calc((100% - 50px)/2); } 
#notice .booking-box .tab-panel { flex-direction: column; padding: 12px 0; } 
#notice .booking-box .tab-panel > li { position: relative; padding-left: 15px; font-size: 1.063rem; color: #2f2f2f; line-height: 1.8; } 
#notice .booking-box .tab-panel > li:before { position: absolute; top: -6px; left: 0; content: '.'; display: block; width: 5px; height: 5px; color: #000; } 
#notice .booking-box .tab-panel > li:hover { background-color: #F8F9FB; } 
#notice .booking-box .text { width: 80%; text-align: left; } 
#notice .booking-box .date { color: #5c5c5c; } 
#oftenUse, #season { margin-top: 25px; } 





/* ----------------------------------- */
/* notice section */
/* ----------------------------------- */
#notice .youtube-box .inner-box { display: flex; flex-direction: row-reverse; gap: 30px; } 
#notice .youtube-box .tab-list { flex-direction: column; background: #FAFAFE; width: 40%; height: max-content; padding: 20px 0; border-radius: 10px; } 
#notice .youtube-box .tab-list li { position: relative; padding-left: 5px; overflow: hidden; border-bottom: 1px solid #E8EAF0; } 
#notice .youtube-box .tab-list li:last-child { border-bottom: none; } 
#notice .youtube-box .tab-list li.on button a, #notice .youtube-box .tab-list li.on:before { color:#245eb0; } 
#notice .youtube-box .tab-list > li:before { position: absolute; top: 20%; transform: translateY(-50%); left: 9px; content:'.'; display: block; width: 5px; height: 5px; } 
#notice .youtube-box .tab-list button { width: 100%; text-align: left; background-color: transparent; border: none; padding: 6px 15px; cursor: pointer; } 
#notice .youtube-box .tab-list button a { all: unset; color: #2f2f2f; font-family: 'gmarketSansM'; font-size: 0.938rem; word-break: break-word; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } 
#notice .youtube-box .tab-panel-box { width: 60%; } 
#notice .youtube-box .tab-panel-box .thumb { height: 196px; overflow: hidden; border-radius: 20px; } 
#notice .youtube-box .tab-panel-box img { width: 100%; transform: scale(1) translateY(-22%); } 




/* ----------------------------------- */
/* banner section */
/* ----------------------------------- */
#banner { padding: 40px 0 45px; margin: 50px 0; background-image: linear-gradient(to right, #f5faff, #e9fbfa); } 
#banner .title { margin-bottom: 30px; } 
#banner .popBannerSlide { padding: 32px 0 75px; } 
#banner .btn_box { position: absolute; bottom: -4px; display: flex; align-items: center; justify-content: center; gap: 5px; width: 100%; font-size: 0.938rem; } 
#banner .btn_box * { all: unset; cursor: pointer; } 
#banner .btn_box .swiper-pagination { border: 1px solid #F1F1F1; padding: 12px 14px 10px; background-color: #fff; border-radius: 20px; } 
#banner .swiper-button-next:after,#banner .swiper-button-prev:after, #banner .swiper-button-prev:after, #banner .swiper-rtl .swiper-button-next:after { display: none; } 
#banner .swiper-button-state.pause { position: relative; top: -2px; content: url(../images/icons/play_btn.png); } 
#banner .popBannerSlide .swiper-slide { display: flex; border-radius: 12px; outline: 1px solid #ddd; overflow: hidden; /* scale: 0.9; */box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.1); } 
#banner .popBannerSlide .swiper-slide-active { scale: 1.2; z-index: 1; transition: 0.3s; } 
#banner .popBannerSlide .swiper-slide > img { width: 100%; } 




/* ----------------------------------- */
/* promotion section */
/* ----------------------------------- */
.promotion-box { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; } 
.promotion-box img { border-radius: 6px; vertical-align: top; } 
.promotion-box > div:hover img { outline: 1px solid #0D63BC; } 




/* ----------------------------------- */
/* field section */
/* ----------------------------------- */
#field { margin-block: 44px; } 
#field .tab-panel { gap: 50px; min-height: 220px; padding-top: 35px; } 
#field .tab-panel>li { width: calc((100% - 50px)/7); } 
#field .tab-panel>li>a { flex-direction: column; align-items: center; text-align: center; } 
#field .tab-panel .ico { height: 80px; margin-bottom: 15px; } 
#field .tab-panel .text { font-size: 1.125rem; white-space: normal; } 
.title, .title span { font-size: 1.563rem; font-weight: 600; margin-bottom: 14px; } 
span.sub-title { font-size: 0.938rem; color: #8989A0; } 





/* ----------------------------------- */
/* hotplace section */
/* ----------------------------------- */
#hotplace { background-color: #EBF1F7; } 
#hotplace .left { display: flex; flex-direction: column; } 
#hotplace .left button { position: relative; background: #fff; color: var(--main-color); border: none; border-radius: 20px; width: fit-content; margin-top: 36px; padding: 14px 60px 14px 20px; cursor: pointer; box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1); } 
#hotplace .left button:before { position: absolute; top: 12px; right: 10px; content: ''; display: block; width: 50px; height: 25px; background: url(../images/hotplace-section/map.png) no-repeat center/contain; } 
#hotplace .right button { position: relative; border: none; background-color: #1E1E1E; color: #fff; border-radius: 20px; padding-inline: 12px; cursor: pointer; } 
#hotplace .right button:after { position: absolute; top: 50%; left: 105%; transform: translateY(-50%); content: ''; display: block; width: 15px; height: 15px; background-color: #000; border-radius: 50%; } 
#hotplace .right button.point-l:after { left: -25%; } 
#hotplace .right button.on { background-color: #F44977; } 
#hotplace .right button.on:after { width: 10px; height: 10px; outline: 5px solid #F44977; background-color: #fff; } 
#hotplace .hotplace-box { padding: 40px 20px 80px; gap: 50px; justify-content: space-between; } 
#hotplace .hotplace-box .left>img { width: 466px; } 
#hotplace .hotplace-detail { flex-direction: column; } 
#hotplace .hotplace-img { width: 100%; aspect-ratio: 730 / 274; background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 20px; margin-top: 40px; } 
#hotplace .hotplace-name { margin: 30px 0 20px; font-weight: 600; font-size: 18px; } 
#hotplace .hotplace-text-box { display: flex; gap: 30px; } 
#hotplace .tab-desc-box .left { gap: 20px; width: 60%; word-break: keep-all; border-radius: 12px; background-color: #fff; padding: 25px; line-height: 1.571; } 
#hotplace .tab-desc-box .left .desc { color: #757575; } 
#hotplace .tab-desc-box .right { width: 40%; } 
#hotplace .hotplace-text-box .right .row { gap: 15px; } 
#hotplace .hotplace-text-box .right .text { line-height: 20px; } 
#hotplace .hotplace-text-box .right .text div:nth-child(1) { margin-bottom: 5px; } 
#hotplace .hotplace-text-box .right .call { margin-bottom: 25px; } 
#hotplace .mini-map { position: absolute; } 
#hotplace .tab-box > button { position: absolute; } 
#hotplace .right { position: relative; } 
#hotplace .right .bukhan { top: 25px; left: 220px; } 
#hotplace .right .newtemple { top: 20px; right: 100px; } 
#hotplace .right .dragontemple { top: 60px; right: 210px; } 
#hotplace .right .dosuntemple { top: 100px; left: 200px; } 
#hotplace .right .bonghwang { top: 130px; left: 310px; } 
#hotplace .right .boghkwang { top: 180px; left: 250px; } 
#hotplace .right .parkeulbok { top: 217px; left: 250px; } 
#hotplace .right .sunkook { top: 254px; left: 61px; } 
#hotplace .right .guklip { top: 266px; left: 226px; } 
#hotplace .right .solbat { top: 266px; left: 436px; } 
#hotplace .right .kunhyun { top: 284px; left: 96px; } 
#hotplace .right .yoon { top: 354px; left: 346px; } 
#hotplace .right .bonwon { top: 360px; left: 128px; } 
#hotplace .right .tongil { top: 379px; left: 298px; } 
#hotplace .right .hwagye { top: 440px; left: 125px; } 
#hotplace .right .samsung { top: 470px; left: 45px; } 
#hotplace .right .sungshin { top: 604px; left: 225px; } 
#hotplace .right .odong { top: 634px; left: 212px; } 
#hotplace .right .northforest { top: 790px; left: 409px; } 
#hotplace .btn-box { margin-top: 20px; gap: 15px; } 
#hotplace .btn-box > div a { width: max-content; padding: 14px 18px 10px; border-radius: 30px; } 
#hotplace .btn-box .viewDetail a { border: 1px solid rgb(2, 78, 161); color: rgb(2, 78, 161); } 
#hotplace .btn-box .homepage a { border: 1px solid #F44977; color: #F44977; } 
#hotplace p { font-size: 13px; } 


/* ----------------------------------- */
/* footer section */
/* ----------------------------------- */
footer { background-color: #4F5469; color: #fff; } 
.footer-nav { justify-content: space-between; border-bottom: 1px solid #73778a; margin-bottom: 25px; } 
.footer-nav>.flex-box { gap: 50px; padding: 33px 0 27px; } 
.footer-box .center > a { border: 1px solid; padding: 14px 20px 11px; } 
.footer-box .center > a:not(:first-child) { margin-left: -1px; } 
.footer-box .bottom { flex-direction: column; gap: 20px; padding: 25px 0 60px; } 
.footer-box .bottom address { font-style: normal; } 
.footer-box .bottom * { font-size: 0.938rem; font-family: 'gmarketsansM'; } 
footer .sns { display: flex; align-items: center; gap: 5px; } 
footer .sns > a { width: 22px; height: 22px; } 
footer .sns i { width: 22px; height: 22px; background-image: url(../images/icons/sprite-common.png); background-repeat: no-repeat; background-position-x: -509px } 
footer .sns .naver > i { background-position-y: -82px; } 
footer .sns .facebook > i { background-position-y: -124px; } 
footer .sns .instagram > i { background-position-y: -166px; } 
footer .sns .youtube > i { background-position-y: -250px; } 
footer .sns .kakao > i { background-position-y: -208px; } 



/* ----------------------------------- */
/* aside */
/* ----------------------------------- */
aside { position: fixed; top: 50%; right: 2.4vw; transform: translateY(-50%); display: flex; flex-direction: column; align-items: center; } 
aside > * { cursor: pointer; } 
aside a { display: inline-block; width: 100%; height: 100%; } 
aside .smsAlarm, aside .aside--sns_box i, aside .magazine { background-position: center; background-repeat: no-repeat; background-size: contain; } 
aside .smsAlarm { width: 130px; height: 76px; background-image: url(../images/aside/alarm.png); } 
aside .chatBot { background-image: url(../images/icons/sprite-common.png); background-position: 0px -99px; width: 99px; height: 99px; } 
aside .aside--sns_box { margin-block: 15px; } 
aside .aside--sns_box ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; } 
aside .aside--sns_box > li { display: flex; align-items: center; justify-content: center; flex-direction: column; width: 120px; background-color: #fff; border-radius: 12px; box-shadow: 0 0 2px 4px rgba(0, 0, 0, 0.05); } 
aside .aside--sns_box i { width: 39px; height: 39px; } 
aside .aside--sns_youtube i { background-image: url(../images/aside/sns_youtube.png) } 
aside .aside--sns_kakao i { background-image: url(../images/aside/sns_kakao.png) } 
aside .aside--sns_facebook i { background-image: url(../images/aside/sns_facebook.png) } 
aside .aside--sns_blog i { background-image: url(../images/aside/sns_blog.png) } 
aside .aside--sns_insta i { background-image: url(../images/aside/sns_insta.png) } 
aside .aside--sns_carrot i { background-image: url(../images/aside/sns_carrot.png) } 
aside .magazine { width: 130px; height: 144px; background-image: url(../images/aside/side-magazine.png); } 



/* focus */
a { display: inline-block; } 
a:focus, #notice .youtube-box .tab-list button:focus, #hotplace .left button:focus, #hotplace .btn-box > div a:focus { border: 1px dashed #000; outline: none; } 
#introSec .intro-left-box button:focus, footer a:focus, header .right .hamburger:focus { border: 1px dashed #fff; outline: none; } 
#introSec .intro-left-box .form-bottom-text .hash>li a:focus,
#introSec .intro-right-box .bottom-box>.box a:focus { background-color: var(--color-blue02); color: #fff; border: 1px dashed #fff; } 
#introSec .intro-right-box .radius-box>.box a:focus, 
#hotIssue .tab-panel > li > a:focus { text-decoration: underline; text-underline-offset: 5px; } 
#introSec .intro-right-box .bottom-box>.box a:focus .text { color: #fff; } 
#introSec .intro-right-box .bottom-box a:focus .ico { filter: brightness(0) invert(1); } 
:is(#hotIssue, #oftenUse, #season) .tab-panel>li>a:focus, #field .tab-panel>li>a:focus { transition: transform 0.3s; transform: translateY(-10px); } 
:is(#hotIssue, #oftenUse, #season) .tab-panel>li>a:focus .text, #field .tab-panel>li>a:focus .text { color: var(--color-blue01); } 
#hotplace .tab-box > button:focus { background-color: #FF4C75; border: 1px dashed #fff; outline: none; } 
.footer-box .center > a:focus { border:none; outline: 1px dashed #fff; }