@charset "utf-8";
/*
@import url(//fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500;700;900&display=swap');
*/

/* Reset */
*{outline: none;}
html {overflow-y:scroll}
body {margin:0;padding:0;x-font-size:0.75em;height:100%;x-font-family: "メイリオ", Meiryo;x-font-weight:400}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img, dl, dt, dd, p {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
header ul, nav ul, footer ul {margin:0;padding:0;list-style:none}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-size:1em}
button,input[type=button],input[type=submit]{cursor:pointer;}
input[type=text], input[type=password], input[type=submit], input[type=image], button {border-radius:0;-webkit-appearance:none}
textarea, select {font-size:1em;}
textarea {border-radius:0;-webkit-appearance:none}
p {margin:0;padding:0;word-break:break-all}
pre {overflow-x:scroll;font-size:1.1em}
a:link, a:visited {color:inherit;text-decoration:none}
ul,ol,li{list-style:none;padding:0;margin:0;}
input, button, textarea, select {x-font-family: "メイリオ", Meiryo; outline: none}
hr {content: '';display:block;padding:0;border:0;margin: 0;}
.clear {clear:both}
.fl {float: left;}
.fr {float: right;}

/*사파리 버튼 초기화*/
input[type="text"], input[type="password"], input[type="button"], input[type="submit"], textarea { -webkit-appearance: none; -webkit-border-radius: 0; }

/*placeholder*/
input::-ms-input-placeholder { color: #666; }
input::-webkit-input-placeholder { color: #666; }
input::-moz-placeholder { color: #666; }

/*드래그*/
::selection { background: #4e67ff; color: #fff; }
::-moz-selection { background: #4e67ff; color: #fff; }

/*스크롤바 커스텀*/
.scroll-custom {
    scrollbar-arrow-color: #8f8b88;
    scrollbar-base-color: transparent;
    scrollbar-3dlight-color: transparent;
    scrollbar-darkshadow-color: transparent;
    scrollbar-face-color: #8f8b88;
    scrollbar-highlight-color: transparent;
    scrollbar-shadow-color: transparent;
    scrollbar-track-color: transparent;
}

.scroll-custom::-webkit-scrollbar {
    display: block;
    width: 6px;
    height: 5px;
    border: 0;
}

/*스크롤 영역 색*/
.scroll-custom::-webkit-scrollbar-track {
    display: block;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background : transparent;
}

/*스크롤바 색*/
.scroll-custom::-webkit-scrollbar-thumb {
    display: block;
    width: 6px;
    height: 2px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: #ebebeb;
}


/*--------------------------------------------------------------------------------------------------------------------------*/


/*썸네일*/
.thumb { width: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; }


/*섹션1*/
.slide-main { position: relative; height: 610px; }
.slide-main .swiper-container { height: 100%; }
.slide-main .swiper-slide { position: relative; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; }

.slide-conts { position: absolute; top: 0; left: 0; z-index: 10; width: 100%; height: 100%; }
.slide-conts .img-pattern { position: absolute; top: 0; left: 0; right: 0; margin: 0 auto; }
.slide-conts .txt-slide { position: absolute; top: 53%; left: 50%; transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); width: 100%; text-align: center; }
.slide-conts .txt-slide h2 { margin-bottom: 25px; x-font-family: 'Nanum Myeongjo'; font-size: 60px; font-weight: 600; color: #fff; line-height: 70px; }
.slide-conts .txt-slide h3 { font-size: 24px; font-weight: 400; color: #fff; }

.slide-main .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.25); }
.slide-main .location-info { position: absolute; right: 35px; bottom: 30px; font-size: 20px; font-weight: 600; color: #fff; }
.slide-main .location-info img { margin-right: 8px; vertical-align: -4px; }

.swiper-container-vertical>.swiper-pagination-bullets { right: 20px; }
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 10px 0; }
.swiper-pagination-bullet { width: 20px; height: 20px; border-radius: 50%; box-sizing: border-box; background: #fff; opacity: 1; }
.swiper-pagination-bullet-active { background: #44d1d8 !important; }

.swiper-pagination { width: auto !important; }
.swiper-container-horizontal>.swiper-pagination-bullets { display: flex; flex-direction: column; justify-content: center; top: 0; bottom: 0; left: auto; right: 20px; }
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { display: block; margin: 5px 0; }


/*섹션2*/
.sec2 { padding-top: 120px; box-sizing: border-box; background: url('../img/img_pattern2.png') center 23px; background-repeat: repeat-x; }
.sec2 .tit-area { margin-bottom: 60px; color: #f37a72; text-align: center; }
.sec2 .tit-area h2 { margin-bottom: -10px; font-size: 26px; font-weight: 600; }
.sec2 .tit-area h3 { x-font-family: 'Noto Sans TC'; font-size: 42px; font-weight: 600; letter-spacing: -1px; }

.intro-area { height: 530px; background: #f4f1ee; }
.intro-area .inner { width: 1035px; max-width: 100%; height: 100%; margin: 0 auto; padding: 95px 30px 90px 0; box-sizing: border-box; background: url('../img/img_map1.png') right bottom no-repeat; }
.intro-area h2 { font-size: 20px; font-weight: 600; color: #f37a72; }
.intro-area h3 { margin-bottom: 40px; font-size: 30px; font-weight: 600; color: #333; }
.intro-area h3 span { margin-left: 15px; font-size: 15px; }
.intro-area .intro-conts { font-size: 13px; font-weight: 400; color: #333; line-height: 24px; }
.intro-area .intro-conts .img-map { display: none; }


/*섹션3*/
.sec3 { padding-bottom: 50px; box-sizing: border-box; }
.tbl-weather { width: 100%; max-width: 1035px; margin: 0 auto 40px; border-collapse: collapse; border-top: 2px solid #ddd; border-bottom: 2px solid #ddd; box-sizing: border-box; }
.tbl-weather tr { height: 64px; border-bottom: 2px solid #ddd; box-sizing: border-box; }
.tbl-weather tr:first-child { x-height: 73px; vertical-align: bottom; }
.tbl-weather th { padding-bottom: 10px; box-sizing: border-box; x-font-family: '微软雅黑', sans-serif; font-size: 15px; font-weight: 600; color: #333; }
.tbl-weather th span { color: #f37a72; }
.tbl-weather td { x-font-family: '微软雅黑', sans-serif; font-size: 15px; font-weight: 400; color: #333; text-align: center; }
.tbl-weather td .day { display: inline-block; width: 55px; height: 27px; margin-right: 12px; border-radius: 10px; box-sizing: border-box; font-size: 15px; font-weight: 400; color: #fff; line-height: 27px; }
.tbl-weather td .day-v1 { background: #f79ca8; }
.tbl-weather td .day-v2 { background: #84abd0; }
.tbl-weather td .flex { display: flex; justify-content: center; align-items: center; }
.tbl-weather td .weather-info { margin-right: 20px; }
.tbl-weather td .weather-info .ico-weather { margin-right: 8px; }
.tbl-weather td .temperature-info span:nth-child(1) { color: #ef2e1d; }
.tbl-weather td .temperature-info span:nth-child(2) { color: #96c0f9; }
.tbl-weather td:nth-child(3) div div { margin: 0 10px; }

.tbl-weather th:nth-child(1),
.tbl-weather td:nth-child(1) { width: 20%; }
.tbl-weather th:nth-child(2),
.tbl-weather td:nth-child(2) { width: 50%; }
.tbl-weather th:nth-child(3),
.tbl-weather td:nth-child(3) { width: 20%; }

.btn-view { display: block; width: 283px; max-width: 100%; height: 57px; margin: 0 auto; border: 2px solid #ccc; box-sizing: border-box; background: url('../img/btn_arrow_right1.png') 80% center no-repeat #fff; background-size: 12px; x-font-family: '微软雅黑', sans-serif; font-size: 16px; font-weight: 600; color: #666; }

/*섹션4*/
.list-photo { display: flex; flex-wrap: wrap; width: 100%; }
.list-photo li { display: flex; flex-wrap: wrap; justify-content: space-between; width: 25%; }
.list-photo .photo-item { display: block; position: relative; width: 100%; padding: 1px; box-sizing: border-box; }
.list-photo .item4 .photo-item { width: 50%; }
.list-photo .photo-item a { display: block; position: relative; width: 100%; height: 100%; }
.list-photo .photo-item a:hover:after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../img/img_pattern3.png') center center no-repeat; background-size: contain; }

.x-list-photo .photo-item:nth-of-type(1) a:hover:after { background-color: rgba(132, 171, 208, 0.56); }
.x-list-photo .photo-item:nth-of-type(2) a:hover:after { background-color: rgba(104, 106, 234, 0.56); } /* spot */
.x-list-photo .photo-item:nth-of-type(3) a:hover:after { background-color: rgba(253, 175, 185, 0.56); } /* gourmet */
.x-list-photo .photo-item:nth-of-type(4) a:hover:after { background-color: rgba(234, 231, 104, 0.56); } /* sns */

.list-photo .photo-item a span { display: none; position: absolute; left: 15px; bottom: 15px; z-index: 1; font-size: 13px; font-weight: 600; color: #fff; }
.list-photo .photo-item a:hover span { display: block; }

/*심플 라이트박스 커스텀*/
.slbOverlay { background-color: #fff; }
.slbCaption { display: inline-block; position: absolute; left: 0; right: auto; bottom: 80px; width: auto; max-width: none; padding: 3px 20px; box-sizing: border-box; background: rgba(25, 242, 209, 0.6); font-size: 20px; font-weight: 600; color: #fff; }
/*.slbImageWrap:after { content: '테스트'; display: block; position: absolute; top: auto; bottom: 24px; height: 36px; padding: 8px 20px 0 0; box-sizing: border-box; font-size: 14px; font-weight: 600; color: #999; text-align: right; }*/
.caption { display: block; position: absolute; top: auto; bottom: 24px; width: 100%; height: 36px; padding: 8px 20px 0 0; border: 1px solid #cecece; border-top: none; box-sizing: border-box; background: #fff; font-size: 14px; font-weight: 600; color: #999; text-align: right; }


/*섹션5*/
.sec5 { padding-top: 140px; box-sizing: border-box; }
.sec5 .tit-area { margin-bottom: 25px; text-align: center; }
.sec5 .tit-area h2 { font-size: 26px; font-weight: 600; color: #f37a72; }
.sec5 .tit-area h3 { font-size: 20px; font-weight: 600; color: #333; }

.tip-area { padding: 70px 0 80px; box-sizing: border-box; background: #fff6f6; }
.tip-area .inner { width: 1035px; max-width: 100%; margin: 0 auto; background: url('../img/img_tip_bg.png') center top no-repeat; background-size: contain; }
.list-tip { width: 846px; max-width: 100%; margin: 0 auto; }
.list-tip li { margin-bottom: 83px; cursor: pointer; }
.list-tip li:last-child { margin-bottom: 0; }
.list-tip .box-tip { position: relative; }
.list-tip .img-area { position: relative; width: 646px; max-width: 100%; }
.list-tip .img-tip { width: 100%; }
.list-tip .box-theme { position: absolute; right: 0; bottom: -56px; width: 266px; padding: 9px; border: 2px solid #fff; box-sizing: border-box; }
.list-tip .box-theme .theme-info { padding: 20px 15px; box-sizing: border-box; background: #fff; }
.list-tip .box-theme .theme-info h2 { margin-bottom: 5px; font-size: 20px; font-weight: 600; color: #df5353; }
.list-tip .box-theme .theme-info h3 { margin-bottom: 40px; font-size: 16px; font-weight: 600; color: #000037; }
.list-tip .box-theme .theme-info .tip-conts { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; max-height: 104px; white-space: normal; overflow: hidden; margin-bottom: 40px; font-size: 13px; font-weight: 600; color: #666; line-height: 26px; }
.list-tip .box-theme .btn-more { display: block; margin: 0 0 0 auto; font-size: 14px; font-weight: 600; color: #f37a72; text-align: right; }

.list-tip li:nth-child(even) .img-area { margin: 0 0 0 auto; }
.list-tip li:nth-child(even) .box-theme { left: 0; right: auto; }

.list-tip li:nth-child(1) .img-pattern { position: absolute; bottom: 0px; left: 0px; }
.list-tip li:nth-child(2) .img-pattern { position: absolute; bottom: 0px; right: 0px; }
.list-tip li:nth-child(3) .img-pattern { position: absolute; bottom: 0px; left: 0px; }


/*섹션6*/
.sec6 { padding-top: 100px; box-sizing: border-box; }
.sec6 .tit-area { margin-bottom: 30px; text-align: center; }
.sec6 .tit-area h2 { margin-bottom: -2px; font-size: 26px; font-weight: 600; color: #333; }
.sec6 .tit-area h3 { font-size: 20px; font-weight: 600; color: #4e4343; }

.map-area { display: flex; justify-content: space-between; height: 614px; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; box-sizing: border-box; }
.map-area .box-map { width: 100%; height: 100%; }
.map-area .box-map.active { width: calc(100% - 416px); }
.root_daum_roughmap { width: 100% !important; height: 100%; padding: 0 !important; border: none !important; box-sizing: border-box; }
.root_daum_roughmap .map { height: 100% !important; }
.root_daum_roughmap .wrap_map { height: 100% !important; }
.root_daum_roughmap .wrap_controllers { display: none; }

.map-info { display: none; width: 416px; }
.map-info.active { display: block; }
.map-info .img-area { position: relative; height: 222px; }
.map-info .img-area .thumb { height: 100%; }
.map-info .img-area .btn-close { position: absolute; top: 10px; left: 10px; width: 39px; height: 39px; border: none; border-radius: 50%; box-sizing: border-box; background: url('../img/btn_close2.png') center center no-repeat; background-size: contain; }
.map-info .map-conts { height: calc(100% - 222px); padding: 20px 25px; box-sizing: border-box; background: #fff; overflow-y: scroll; }
.map-info .map-conts .location-name { margin-bottom: 5px; font-size: 16px; font-weight: 600; color: #333; }
.map-info .map-conts .location-conts { font-size: 13px; font-weight: 400; color: #696262; line-height: 24px; white-space: pre-line; }


/*섹션7*/
.sec7 { padding: 70px 0 50px; border-top: 14px solid #f79ca8; box-sizing: border-box; }
.sec7 .tit-area { margin-bottom: 25px; text-align: center; }
.sec7 .tit-area h2 { font-size: 26px; font-weight: 600; color: #333; }

.list-region { display: flex; flex-wrap: wrap; justify-content: space-around; width: 1035px; max-width: 100%; margin: 0 auto; }
.list-region li { display: flex; flex-direction: column; align-items: center; width: 15%; }
.list-region .thumb-area { margin-bottom: 15px; }
.list-region .thumb { width: 123px; height: 123px; border: 6px solid #fff; border-radius: 50%; box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); box-sizing: border-box; }
.list-region .region-name { margin-bottom: 10px; font-size: 16px; font-weight: 600; color: #333; }
.list-region .btn-go { width: 58px; height: 21px; border: none; border-radius: 11px; box-sizing: border-box; background: #f98e9c; font-size: 14px; font-weight: 600; color: #fff; }


/*섹션8*/
.sec8 { padding: 70px 0 50px; box-sizing: border-box; }
.sec8 .tit-area { margin-bottom: 25px; text-align: center; }
.sec8 .tit-area h2 { font-size: 26px; font-weight: 600; color: #333; }

.list-report { display: flex; flex-wrap: wrap; justify-content: space-between; width: 1035px; max-width: 100%; margin: 0 auto 30px; }
.list-report li { position: relative; width: 33%; height: 374px; background-position: center center; background-repeat: no-repeat; background-size: cover; cursor: pointer; }
.list-report li:last-chid { margin-right: 0; }
.list-report li:nth-child(1) { x-background-image: url('../img/img_report3.jpg'); x-background-position: 90% center; }
.list-report li:nth-child(2) { x-background-image: url('../img/img_report2.jpg'); x-background-position: 35% center; }
.list-report li:nth-child(3) { x-background-image: url('../img/img_report1.jpg'); x-background-position: 55% center; }
.list-report .report-item { padding: 2px; box-sizing: border-box; }
.list-report .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; mix-blend-mode: multiply; }
.list-report li:nth-child(1) .bg { background: rgba(160, 206, 247, 0.58);}
.list-report li:nth-child(2) .bg { background: rgba(243, 130, 114, 0.66); }
.list-report li:nth-child(3) .bg { background: rgba(243, 219, 114, 0.48); }
.list-report .box-report { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); width: 100%;width: 233px; height: 138px; border: 5px solid #fff; box-sizing: border-box; text-align: center; }
.list-report .box-report > div { width: 100%; height: 100%; padding: 20px 25px 0; box-sizing: border-box; background: rgba(0, 0, 0, 0.2); }
.list-report .box-report h2 { margin-bottom: 25px; font-size: 15px; font-weight: 400; color: #fff; }
.list-report .box-report h3 { font-size: 15px; font-weight: 600; color: #fff; }


/*섹션9*/
.sec9 { padding: 70px 0 50px; box-sizing: border-box; }
.sec9 .tit-area { margin-bottom: 25px; text-align: center; }
.sec9 .tit-area h2 { font-size: 26px; font-weight: 600; color: #333; }

.btns-transport { display: flex; justify-content: center; }
.btns-transport .btn-transport { height: 55px; margin: 0 15px; border: none; border-radius: 28px; box-sizing: border-box; background: url('../img/btn_arrow_right1.png') 90% center no-repeat #ebebeb; font-size: 16px; font-weight: 600; color: #333; }
.btns-transport .btn-transport:nth-child(1) { width: 158px; }
.btns-transport .btn-transport:nth-child(2) { width: 203px; }
.btns-transport .btn-transport:nth-child(3) { width: 318px; }


/*섹션10*/
.sec10 { padding: 70px 0 50px; box-sizing: border-box; background: url('../img/img_pattern6.png') center center no-repeat; }
.sec10 .tit-area { margin-bottom: 25px; text-align: center; }
.sec10 .tit-area h2 { font-size: 26px; font-weight: 600; color: #333; }

.box-tour-hotel { display: flex; justify-content: center; width: 1035px; max-width: 100%; margin: 0 auto 110px; }
.list-tour-hotel { width: 48.5%; max-width: 467px; margin: 0 15px; }
.list-tour-hotel:last-child { margin-right: 0; }
.list-tour-hotel li { display: flex; margin-bottom: 17px; padding: 19px 26px; border: 1px solid #d0cccc; box-shadow: 8px 6px 0 #dfdfdf; box-sizing: border-box; background: #fff; cursor: pointer; }
.list-tour-hotel li:last-child { max-width: 455px; margin-top: 28px !important; padding: 0; border: none; box-shadow: none; }
.list-tour-hotel:first-child li:last-child { margin: 0 0 0 auto; }
.list-tour-hotel:last-child li:last-child { margin: 0 auto 0 0; }
.list-tour-hotel .thumb-area { width: 159px; height: 119px; margin-right: 15px; }
.list-tour-hotel .thumb-area .thumb { width: 100%; height: 100%; }
.list-tour-hotel .tour-hotel-info { display: flex; flex-direction: column; justify-content: center; width: calc(100% - 174px); }
.list-tour-hotel .tour-hotel-info h2 { margin-bottom: 15px; font-size: 15px; font-weight: 600; color: #333; }
.list-tour-hotel .tour-hotel-info h3 { margin-bottom: -2px; font-size: 15px; font-weight: 400; color: #666; line-height: 18px; }
.list-tour-hotel .tour-hotel-info h4 { font-size: 18px; font-weight: 600; color: #f37a72; }
.list-tour-hotel .btn-more { width: 100%; height: 56px; border: none; background: #e7e7e7; font-size: 16px; font-weight: 400; color: #666; }
.btns-sns { width: 427px; max-width: 90%; margin: 0 auto; }
.btns-sns .btn-sns { display: block; position: relative; width: 427px; max-width: 100%; height: 56px; margin-bottom: 29px; border: 2px solid #000; background: #f6c0be; font-size: 24px; font-weight: 600; color: #000; text-align: center; line-height: 58px; }
.btns-sns .btn-sns .shadow { display: block; position: absolute; }
.btns-sns .btn-sns .shadow-r { right: -11px; top: 2px; width: 9px; height: calc(100% + 4px); transform: skewY(40deg); background: #000; }
.btns-sns .btn-sns .shadow-b { left: 2px; bottom: -10px; width: calc(100% + 4px); height: 10px; transform: skewX(40deg); background: #000; }
.btns-sns2 { text-align: center; }
.btns-sns2 a { margin: 0 40px; }


/*섹션11*/
.sec11 img { width: 100%; }


/*테마*/
/*header style*/
.header { padding-top: 50px; box-sizing: border-box; background: url('../img/img_pattern2.png') center 12px; background-repeat: repeat-x; }
.hd-menu { display: flex; justify-content: space-between; width: 1035px; max-width: 100%; height: 66px; margin: 0 auto; }
.hd-menu li { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; }
.hd-menu a { display: block; font-size: 20px; font-weight: 600; color: #8f8989; }
.hd-menu li:nth-child(1) a.active { color: #f37a72; }
.hd-menu li:nth-child(2) a.active { color: #4db2b7; }
.hd-menu li:nth-child(3) a.active { color: #b689d9; }
.hd-theme { position: relative; height: 573px; background: url('../img/bg_theme1.jpg') center center no-repeat; background-size: cover; overflow: hidden; }
.hd-theme .img-wave { position: absolute; left: 0; right: 0; bottom: 0; z-index: 4; width: 100%; }
.hd-theme .img-pattern { position: absolute; left: 0; right: 0; bottom: -80px; z-index: 2; margin: 0 auto; }
.hd-theme .bg { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background: rgba(49, 46, 73, 0.4); mix-blend-mode: multiply; }

.hd-theme-v1 { background-image: url('../img/bg_theme2.jpg'); }
.hd-theme-v2 { background-image: url('../img/bg_theme3.jpg'); }
.hd-theme-v1 .img-pattern-v1 { top: 0; left: 0; right: auto; }
.hd-theme-v1 .img-pattern-v2 { left: auto; right: 0; bottom: -100px; }

.theme-intro { position: absolute; top: 40%; left: 50%; z-index: 3; transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); width: 100%; }
.theme-num { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 124px; height: 124px; margin: 0 auto 30px; border-radius: 50%; box-sizing: border-box; line-height: 40px; }
.theme-num-v1 { background: #ff8d8d; }
.theme-num-v2 { background: #69ced2; }
.theme-num-v3 { background: #b689d9; }

.theme-num h2 { font-size: 24px; font-weight: 600; color: #fff; }
.theme-num h3 { font-size: 60px; font-weight: 600; color: #fff; }
.theme-overview { text-align: center; }
.theme-overview h2 { margin-bottom: 30px; font-size: 36px; font-weight: 600; color: #fff; }
.theme-overview h3 { font-size: 16px; font-weight: 600; color: #fff; line-height: 21px; }

/*햄버거 메뉴*/
.btn-hamburger { display: none; position: fixed; top: 10px; left: 10px; z-index: 20; width: 54px; height: 54px; border: none; border-radius: 50%; box-sizing: border-box; background: rgba(66, 64, 64, 0.77); cursor: pointer; }
.btn-hamburger .stick { position: absolute; left: 0; right: 0; margin: 0 auto; width: 30px; height: 4px; background: #fff; }
.btn-hamburger .stick-t { top: 15px; }
.btn-hamburger .stick-m { top: 24px; }
.btn-hamburger .stick-b { top: 33px; }

.m-header { display: none; }

.theme { background: #fff; }
.theme .inner { width: 1035px; max-width: 100%; margin: 0 auto; padding: 45px 0 80px; box-sizing: border-box; }

.theme .img-title { display: block; margin: 0 auto 55px; }
.theme .img-theme { display: block; position: relative; margin: 0 auto 30px; text-align: center; }
.theme .img-theme img { max-width: 100%; }
.theme .img-theme .img-caption { position: absolute; right: 10%; bottom: 12%; font-size: 13px; font-weight: 400; color: #fff; }
.theme .img-theme2 { display: block; position: relative; margin: 10px 50px 0 0; }
.theme .img-theme2 img { max-width: 100%; }
.theme .img-theme2 .img-caption { position: absolute; right: 5%; bottom: 3%; font-size: 13px; font-weight: 400; color: #fff; }
.theme .img-pattern { display: block; margin: 75px 10% 0 auto; }
.theme .img-pattern2 { display: block; margin: 75px auto 0 10%; }

.btn-next { display: block; position: relative; width: 595px; max-width: 100%; height: 56px; margin: 0 auto; border: 2px solid #000; background: #f6c0be; font-size: 24px; font-weight: 600; color: #000; text-align: center; line-height: 58px; }
.btn-next .shadow { display: block; position: absolute; }
.btn-next .shadow-r { right: -11px; top: 2px; width: 9px; height: calc(100% + 4px); transform: skewY(40deg); background: #000; }
.btn-next .shadow-b { left: 2px; bottom: -10px; width: calc(100% + 4px); height: 10px; transform: skewX(40deg); background: #000; }

.list-theme > li { margin-bottom: 150px; }
.list-theme .box-theme-info { display: flex; justify-content: space-between; }
.list-theme .theme-detail { width: 50%; padding-right: 60px; box-sizing: border-box; }
.list-theme .theme-detail .img-area { width: 50%; }
.list-theme .theme-detail .theme-conts { margin-bottom: 90px; font-size: 15px; font-weight: 400; color: #333; line-height: 30px; }
.list-theme .theme-detail .tit-course { margin-bottom: 15px; font-size: 18px; font-weight: 600; color: #f37a72; }
.list-theme .theme-detail .list-course li { font-size: 15px; font-weight: 400; color: #333; line-height: 30px; }

.bnr-tip { display: block; max-width: 100%; margin: 0 auto 117px; }
.bnr-tip2 { display: none; }

.list-theme2 > li { margin-bottom: 150px; }
.list-theme2 .box-theme-info { display: flex; justify-content: space-between; }
.list-theme2 .box-theme-info .img-area { width: 50%; }
.list-theme2 .box-theme-info .theme-detail { width: 50%; padding-left: 18px; box-sizing: border-box; }
.list-theme2 .tit-theme { margin-bottom: 10px; font-size: 18px; font-weight: 600; color: #1ebac1; }
.list-theme2 .tit-theme img { margin-right: 10px; }
.list-theme2 .theme-conts { margin-bottom: 60px; font-size: 15px; font-weight: 400; color: #333; line-height: 30px; }
.list-theme2 .theme-conts2 { margin-bottom: 40px; font-size: 15px; font-weight: 400; color: #333; line-height: 30px; }
.list-theme2 .tit-program { font-size: 15px; font-weight: 600; color: #336666; }
.list-theme2 .list-program { margin-bottom: 35px; }
.list-theme2 .list-program li { font-size: 15px; font-weight: 400; color: #333; line-height: 30px; }
.list-theme2 .theme-conts3 { font-size: 15px; font-weight: 400; color: #333; line-height: 30px; }

.list-theme3 > li { margin-bottom: 150px; }
.list-theme3 .box-theme-info { display: flex; justify-content: space-between; width: 90%; margin: 0 auto; }
.list-theme3 .box-theme-info .drama-info { width: 50%; }
.list-theme3 .box-theme-info .tit-drama { margin-bottom: 15px; padding-left: 40px; text-indent: -40px; font-size: 18px; font-weight: 600; color: #b689d9; line-height: 28px; }
.list-theme3 .box-theme-info .tit-drama img { margin-right: 10px; }
.list-theme3 .box-theme-info .tit-drama span { margin-left: 20px; color: #666; }
.list-theme3 .box-theme-info .character-info { font-size: 15px; font-weight: 600; color: #333; }
.list-theme3 .drama-conts { width: 50%; font-size: 15px; font-weight: 400; color: #333; line-height: 30px; }


@media only screen and (max-width: 760px) {
    .main { height: 100%; }
    .sec1 { height: 100%; }
    .slide-main { height: 100%; }
    .slide-conts .img-pattern { position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); width: 100%; }
    .slide-conts .txt-slide h2 { font-size: 34px; line-height: 36px; }
    .slide-conts .txt-slide h3 { font-size: 18px; word-break: keep-all; }
    .slide-main .location-info { font-size: 12px; }
    .slide-main .location-info img { height: 18px; }
    .swiper-pagination-bullet { width: 10px; height: 10px; }

    .sec2 { padding-top: 50px; background-size: contain; }
    .sec2 .tit-area { margin-bottom: 20px; }
    .sec2 .tit-area h2 { font-size: 21px; }
    .sec2 .tit-area h3 { font-size: 32px; }

    .sec3 { padding-bottom: 50px; }
    .intro-area { height: auto; }
    .intro-area .inner { padding: 40px 20px 40px 20px; background: none; }
    .intro-area h2 { font-size: 16px; }
    .intro-area h3 { margin-bottom: 20px; font-size: 26px; }
    .intro-area h3 span { margin-left: 8px; font-size: 13px; word-spacing: -5px; }
    .intro-area .intro-conts br { display: none; }
    .intro-area .intro-conts .img-map { display: block; max-width: 100%; }
    .tbl-weather { margin-bottom: 20px; }
    .tbl-weather tr { height: 40px; }
    .tbl-weather tr:first-child { height: 50px; }
    .tbl-weather th { font-size: 12px; }
    .tbl-weather td { font-size: 12px; }
    .tbl-weather td .day { width: 36px; height: 24px; margin-right: 5px; font-size: 12px; line-height: 24px; }
    .tbl-weather td .weather-info { margin-right: 5px; }
    .tbl-weather td .weather-info .ico-weather { height: 20px; }
    .tbl-weather th:nth-child(1),
    .tbl-weather td:nth-child(1) { width: 35%; }
    .tbl-weather th:nth-child(2),
    .tbl-weather td:nth-child(2) { width: 35%; }
    .tbl-weather th:nth-child(3),
    .tbl-weather td:nth-child(3) { width: 30%; }

    .btn-view { height: 40px; background-size: 8px; font-size: 14px; }

    .list-photo li { width: 50%; }

    .sec5 { padding-top: 40px; }
    .sec5 .tit-area { margin-bottom: 30px; }
    .sec5 .tit-area h2 { font-size: 20px; }
    .sec5 .tit-area h3 { font-size: 16px; word-break: keep-all; }
    .tip-area { padding-top: 30px; overflow: hidden; }
    .list-tip li { margin-bottom: 90px; }
    .list-tip .box-theme { width: 55%; padding: 5px; right: 5px; }
    .list-tip li:nth-child(even) .box-theme { left: 5px; }
    .list-tip .box-theme .theme-info { padding: 15px; }
    .list-tip .box-theme .theme-info h2 { font-size: 14px; }
    .list-tip .box-theme .theme-info h3 { margin-bottom: 20px; font-size: 12px; }
    .list-tip .box-theme .theme-info .tip-conts { max-height: 80px; margin-bottom: 20px; font-size: 12px; font-weight: 400; line-height: 20px; }

    .sec6 { padding-top: 40px; }
    .sec6 .tit-area h2 { font-size: 20px; }
    .sec6 .tit-area h3 { font-size: 16px; }
    .map-area { display: block; position: relative; height: 500px; }
    .map-area .box-map.active { width: 100%; }
    .map-info { display: none; width: 100%; height: 500px; }
    .map-info.active { position: absolute; bottom: 0; z-index: 100; }
    .map-info .img-area { height: 195px; }
    .map-info .img-area .btn-close { width: 24px; height: 24px; }
    .map-info .map-conts { height: calc(100% - 195px); }

    .sec7 { padding: 40px 0 20px; border-width: 7px; }
    .sec7 .tit-area h2 { font-size: 20px; }
    .list-region li { width: 33.33%; margin-bottom: 40px; }
    .list-region .thumb-area { margin-bottom: 10px; }
    .list-region .thumb { width: 80px; height: 80px; border-width: 4px; }
    .list-region .region-name { margin-bottom: 5px;  font-size: 14px; }

    .sec8 { padding: 40px 0 20px; }
    .sec8 .tit-area h2 { font-size: 20px; }
    .list-report { display: block; white-space: nowrap; overflow-x: scroll; }
    .list-report li { display: inline-block; width: 75%; height: 200px; }
    .list-report .box-report { width: 65%; height: 100px; border-width: 3px; }
    .list-report .box-report h2 { margin-bottom: 10px; font-size: 12px; }
    .list-report .box-report h3 { font-size: 14px; white-space: normal; }

    .sec9 { padding-top: 50px; }
    .sec9 .tit-area h2 { font-size: 20px; }
    .btns-transport { display: block; padding: 0 15px; box-sizing: border-box; }
    .btns-transport:after { content: ''; display: block; clear: both; }
    .btns-transport .btn-transport { float: left; height: 45px; }
    .btns-transport .btn-transport:nth-child(1) { width: 40%; margin: 0; margin-right: 5%; }
    .btns-transport .btn-transport:nth-child(2) { width: 55%; margin: 0 }
    .btns-transport .btn-transport:nth-child(3) { width: 100%; margin: 0; margin-top: 20px; }

    .sec10 { padding: 40px 0 20px; }
    .sec10 .tit-area h2 { font-size: 20px; }
    .box-tour-hotel { display: block; margin: 0 auto 50px; }
    .list-tour-hotel { width: 90%; }
    .list-tour-hotel li { padding: 10px; }
    .list-tour-hotel:first-child li:last-child { display: none; }
    .list-tour-hotel:last-child li:last-child { display: none; }
    .list-tour-hotel .thumb-area { width: 120px; height: 90px; margin-right: 10px; }
    .list-tour-hotel .tour-hotel-info { width: calc(100% - 130px); }
    .list-tour-hotel .tour-hotel-info h2 { margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
    .list-tour-hotel .tour-hotel-info h3 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-height: 32px; line-height: 16px; white-space: normal; overflow: hidden; }
    .list-tour-hotel .tour-hotel-info h4 { font-size: 14px; }
    .btns-sns .btn-sns { height: 40px; margin-left: -2%; font-size: 18px; line-height: 42px; }
    .btns-sns2 a { margin: 0 10px; }
    .btns-sns2 img { width: 15%; }


    .header { height: 100%; padding-top: 0; }
    .hd-menu { display: none; }
    .hd-theme { height: 95%; }
    .hd-theme .img-pattern { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); width: 150%; }
    .hd-theme-v1 .img-pattern { transform: none; }
    .hd-theme-v1 .img-pattern-v1 { width: 30%; top: 0; left: 0; }
    .hd-theme-v1 .img-pattern-v2 { width: 80%; top: auto; bottom: -10%; left: auto; right: 0; }
    .hd-theme-v2 .img-pattern { top: auto; bottom: -120px; width: 100%; }
    .theme-num { width: 100px; height: 100px; line-height: 30px; }
    .theme-num h2 { font-size: 18px; }
    .theme-num h3 { font-size: 36px; }
    .theme-overview { padding: 0 10px; box-sizing: border-box; }
    .theme-overview h2 { font-size: 24px; }
    .theme-overview h3 { font-size: 15px; }

    .btn-hamburger { display: block; }

    .m-header { display: block; position: fixed; top: 0; left: -100%; z-index: 10; width: 100%; height: 100%; background: url('../img/bg_hamburger1.jpg') center center no-repeat; background-size: 100%; }
    .m-header .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); }
    .m-hd-menu { display: flex; flex-direction: column; justify-content: center; position: relative; height: 100%; margin-top: -10%; padding-left: 10%; box-sizing: border-box; }
    .m-hd-menu > li { margin-bottom: 15%; cursor: pointer; }
    .m-hd-menu > li:last-child { margin-top: 17%; margin-bottom: 0; }
    .m-hd-menu h2 { margin-bottom: 1%; font-size: 7.200vw; font-weight: 600; color: #df5353; }
    .m-hd-menu h3 { font-size: 5.067vw; font-weight: 600; color: #fff; }

    .theme .img-title { max-width: 100%; margin-bottom: 30px; }
    .theme .img-theme { margin-bottom: 20px; }
    .theme .img-pattern { width: 60%; margin-top: 30px; }
    .theme .img-pattern2 { width: 60%; margin-top: 30px; }
    .theme .btn-next { width: 90%; height: 40px; font-size: 16px; line-height: 42px; }

    .list-theme > li { margin-bottom: 50px; padding: 0 20px; box-sizing: border-box; }
    .list-theme .img-theme2 { display: none; }
    .list-theme .box-theme-info { display: block; }
    .list-theme .theme-detail { width: 100%; padding-right: 0; }
    .list-theme .theme-detail .theme-conts { margin-bottom: 30px; font-size: 13px; line-height: 21px; }
    .list-theme .theme-detail .tit-course { margin-bottom: 10px; font-size: 16px; }
    .list-theme .theme-detail .list-course li { font-size: 13px; line-height: 21px; }
    .bnr-tip { display: none; }
    .bnr-tip2 { display: block; max-width: 100%; margin-bottom: 50px; }

    .list-theme2 > li { margin-bottom: 50px; padding: 0 20px; box-sizing: border-box; }
    .list-theme2 .box-theme-info { display: block; }
    .list-theme2 .box-theme-info .img-area { width: 100%; }
    .list-theme2 .box-theme-info .img-area .img-theme:nth-of-type(2) { display: none; }
    .list-theme2 .box-theme-info .theme-detail { width: 100%; padding-left: 0; }
    .list-theme2 .tit-theme { font-size: 16px; }
    .list-theme2 .tit-theme img { height: 18px; margin-right: 5px; vertical-align: -3px; }
    .list-theme2 .theme-conts { margin-bottom: 30px; font-size: 13px; line-height: 21px; }
    .list-theme2 .theme-conts2 { margin-bottom: 25px; font-size: 13px; line-height: 21px; }
    .list-theme2 .tit-program { margin-bottom: 10px; font-size: 14px; }
    .list-theme2 .list-program { margin-bottom: 20px; }
    .list-theme2 .list-program li { font-size: 13px; line-height: 21px; }
    .list-theme2 .theme-conts3 { font-size: 13px; line-height: 21px; }

    .list-theme3 > li { margin-bottom: 50px; padding: 0 20px; box-sizing: border-box; }
    .list-theme3 .box-theme-info { display: block; width: 100%; }
    .list-theme3 .box-theme-info .drama-info { width: 100%; margin-bottom: 20px; }
    .list-theme3 .box-theme-info .tit-drama { margin-bottom: 0; font-size: 16px; }
    .list-theme3 .box-theme-info .tit-drama img { height: 18px; margin-right: 5px; }
    .list-theme3 .box-theme-info .tit-drama span { margin-left: 10px; }
    .list-theme3 .box-theme-info .character-info { font-size: 13px; }
    .list-theme3 .box-theme-info .drama-conts { width: 100%; font-size: 13px; line-height: 21px; }
}