@charset "utf-8";

/*reset*/
body, button, h1, h2, h3, h4, h5, input, select, table, textarea {font-family: 'Apple SD Gothic Neo','Noto Sans KR',Roboto;font-size:14px;font-weight:500;line-height: 1.267em;}
body {position: relative;background-color: #fff;color: #000;word-break: break-all;-webkit-text-size-adjust: none;}
body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, select, table, td, textarea, th, ul {margin:0;padding:0}
img {max-width:100%;vertical-align:middle}
button,input,select,textarea {margin:0;font-size:100%;vertical-align:middle;outline:0;border:0;-webkit-border-radius:0; /* 둥근모서리 */ -webkit-appearance:none; /* 그림자 */color:#000; }
button{border:0;background:none;outline:0;vertical-align:top;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);}
ol,ul {list-style:none}
a {color:inherit;text-decoration: none;-webkit-tap-highlight-color:rgba(0,0,0,0);}

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 300;
    src: url(../../fonts/Noto/NotoSansKR-Light.eot); /* IE9 Compat Modes */
    src: url(../../fonts/Noto/NotoSansKR-Light.eot?#iefix) format("embedded-opentype"), /* IE6-IE8 */
        url(../../fonts/Noto/NotoSansKR-Light.woff2) format("woff2"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Light.woff) format("woff"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Light.otf) format("opentype"); /* Safari, Android, iOS */
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/Noto/NotoSansKR-Regular.eot); /* IE9 Compat Modes */
    src: url(../../fonts/Noto/NotoSansKR-Regular.eot?#iefix) format("embedded-opentype"), /* IE6-IE8 */
        url(../../fonts/Noto/NotoSansKR-Regular.woff2) format("woff2"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Regular.woff) format("woff"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Regular.otf) format("opentype"); /* Safari, Android, iOS */
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 500;
    src: url(../../fonts/Noto/NotoSansKR-Medium.eot); /* IE9 Compat Modes */
    src: url(../../fonts/Noto/NotoSansKR-Medium.eot?#iefix) format("embedded-opentype"), /* IE6-IE8 */
        url(../../fonts/Noto/NotoSansKR-Medium.woff2) format("woff2"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Medium.woff) format("woff"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Medium.otf) format("opentype"); /* Safari, Android, iOS */
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 700;
    src: url(../../fonts/Noto/NotoSansKR-Bold.eot); /* IE9 Compat Modes */
    src: url(../../fonts/Noto/NotoSansKR-Bold.eot?#iefix) format("embedded-opentype"), /* IE6-IE8 */
        url(../../fonts/Noto/NotoSansKR-Bold.woff2) format("woff2"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Bold.woff) format("woff"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Bold.otf) format("opentype"); /* Safari, Android, iOS */
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 900;
    src: url(../../fonts/Noto/NotoSansKR-Black.eot); /* IE9 Compat Modes */
    src: url(../../fonts/Noto/NotoSansKR-Black.eot?#iefix) format("embedded-opentype"), /* IE6-IE8 */
        url(../../fonts/Noto/NotoSansKR-Black.woff2) format("woff2"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Black.woff) format("woff"), /* Modern Browsers */
        url(../../fonts/Noto/NotoSansKR-Black.otf) format("opentype"); /* Safari, Android, iOS */
}

/* main */
html,
body { margin:0; padding:0; width:100%; height:100%; overflow:hidden; }
#responsive-iframe { position:relative; width:100%; height:100%; overflow:hidden; }
#responsive-iframe iframe { position:absolute; top:0; left:0; width:100%; height:100%; border:0; -ms-overflow-style: none; scrollbar-width: none;}
#responsive-iframe iframe::-webkit-scrollbar {display:none;}


/* 240318 diky : 도보코스 전체 듣기 : 도보코스 리스트 위로(z-order) 플레이어 오버레이를 위해 주석처리  */
/*#responsive-iframe.active { height:calc(100% - 163px); }*/
.webGuideNav { position:absolute; top:1.8571em; left:1.8571em; }
.webGuideNav ul { display:flex; }
.webGuideNav ul li { width:9.2857em; text-align:center; }
.webGuideNav ul li a { display:block; padding:.857em 0; font-size:1.1428em; letter-spacing:-.025em; color:#4e4e4e; background:#fff; }
.webGuideNav ul li:first-child a { border-radius:.375em 0 0 .375em; }
.webGuideNav ul li:last-child a { border-radius:0 .375em .375em 0; }
.webGuideNav ul li.active a { background:#292929; color:#fff; }
.webGuideCon { width:100%; height:100%; padding-left:2.2857em; background-repeat:no-repeat; background-size:cover; background-position:center; box-sizing:border-box; }
.webGuideCon.odii { background-image:url(../img/bg_guide_odii.jpg); }
.webGuideCon.odii .conWrap { display:flex; justify-content:space-between; width:100%; height:100dvh; max-width:1060px; /*min-height:675px;*/ margin:0 auto; }
.InfoWrap { display:flex; align-items:center; width:40.849%; color:#fff; }
.InfoWrap .inner { width:100%; }
.InfoWrap .txtArea { margin-top:3.1428em; }
.InfoWrap .txtArea h2 { font-size:2.6em; font-weight:900; }
.InfoWrap .txtArea .sTit { margin-top:.4333em; font-size:2.1428em; font-weight:400; line-height:1.3; letter-spacing:-.05em; }
.InfoWrap .txtArea .sTxt { margin-top:1.5em; font-size:1.1428em; font-weight:400; letter-spacing:-.03em; line-height:1.4; word-break:keep-all; }
.InfoWrap .storeArea { margin-top:5.7142em; }
.InfoWrap .storeArea ul { display:flex; }
.InfoWrap .storeArea ul li { margin-right:.2857em; }
.InfoWrap .storeArea .txt { margin-top:1.5384em; font-size:.9285em; font-weight:400; }
.InfoWrap .copyright { margin-top:1em; font-size:.7142em; font-weight:300; }
.appWrap { width:50.3773%; height:100%; position:relative;  transform: rotate(0);}
.webGuideCon.taxi { background-image:url(../img/bg_guide_taxi.jpg); }
.webGuideCon.taxi .conWrap { display:flex; justify-content:space-between; width:100%; height:100%; max-width:1470px; margin:0 auto; }
.serviceWrap { display:flex; align-items:center; width:40.136%; color:#fff; }
.serviceWrap .inner { width:100%; }
.serviceWrap .img { margin-bottom:3.375em; text-align:center; }
.serviceWrap .tit { font-size:1.6428em; font-weight:700; letter-spacing:-.03em; }
.serviceWrap .txt { margin-top:1.5em; font-size:1.1428em; font-weight:400; letter-spacing:-.03em; line-height:1.5; word-break:keep-all; }
.serviceWrap .txt2 { margin-top:.75em; font-size:1.1428em; font-weight:400; letter-spacing:-.03em; }
.taxiWrap { display:flex; align-items:center; width:50%; background:#fff; }
.taxiWrap .inner { width:100%; padding:0 10.3401%; }
.taxiWrap dl { margin-top:3.2142em; }
.taxiWrap dl:first-child { margin-top:0; }
.taxiWrap dl dt { margin-bottom:.4347em; font-size:1.6428em; font-weight:700; }
.taxiWrap dl dd>ul { display:flex; flex-wrap:wrap; justify-content:space-between; }
.taxiWrap dl dd>ul>li { display:flex; align-items:center; justify-content:space-between; width:49.0566%; margin-top:.8571em; padding:.7142em .7142em .7142em 1.2857em; border:1px solid #d9d9d9; box-sizing:border-box; }
.taxiWrap dl dd>ul>li .txt { font-size:1.2857em; font-weight:400; }
.taxiWrap dl dd>ul>li .btn { display:flex; width:60.15625%; }
.taxiWrap dl dd>ul>li .btn li { flex:1; text-align:center; }
.taxiWrap dl dd>ul>li .btn li a,
.taxiWrap dl dd>ul>li .btn li button { display:block; width:100%; padding:.5625em 0 .6875em; font-size:1.1428em; font-weight:400; letter-spacing:-.03em; color:#282828; line-height:1; border:1px solid #d9d9d9; transition:all .15s; }
.taxiWrap dl dd>ul>li .btn li a { border-left:none; border-radius:0 .25em .25em 0; }
.taxiWrap dl dd>ul>li .btn li button { border-radius:.25em 0 0 .25em; }
.taxiWrap dl dd>ul>li .btn li a:focus,
.taxiWrap dl dd>ul>li .btn li a:hover,
.taxiWrap dl dd>ul>li .btn li button:focus,
.taxiWrap dl dd>ul>li .btn li button:hover { background:#6755bb; border-color:#6755bb; color:#fff; }
.popQR { display:none; align-items:center; justify-content:center; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, .7); }
.popQR .popInner { width:526px; padding:3.3571em 3.7142em 4.2142em; background:#fff; box-sizing:border-box; border-radius:1.4285em; }
.popQR .tit { display:flex; align-items:center; justify-content:space-between; margin-bottom:2.1428em; padding-bottom:1.4285em; border-bottom:1px solid #dfdfdf; }
.popQR .tit p { font-size:1.5em; font-weight:700; letter-spacing:-.03em; color:#020c19; }
.popQR .tit .popClose { display:block; position:relative; width:1.9285em; height:1.9285em; background:url(../img/btn_popclose2.png) no-repeat center; background-size:100%; text-indent:-9999px; }
.popQR .txt { font-size:1.2857em; font-weight:400; letter-spacing:-.03em; color:#020c19; line-height:1.4; }
.popQR .qrImg { margin-top:2.8571em; text-align:center; }
.popQR .qrImg>div { display:inline-block; border:1px solid #d9d9d9; }
@media all and (max-width:1300px) {   
	.taxiWrap { width:55%; }
}
@media all and (max-width:960px) {   
	.webGuideNav { display:none; }
	.webGuideNav.taxi { display:block; }
	.webGuideCon.odii { padding-left:0; }
	.InfoWrap { display:none; }
	.appWrap { width:100%; }
}