/* CSS for PC @date     2018 @author   sarahchan */
/* ------------------------------------------

------------------------------------------ */
.pc { display: none !important; }

img { max-width: 100%; }

#keyVisual { margin-bottom: 0; }

#keyVisual h1 { text-indent: 0px; }

#topNav { background: url(../images/lightpink.jpg) bottom repeat-x #fff; z-index: 999; width: 100%; }

#topNav ul { width: 100%; display: flex; margin: 0 auto; padding: 2% 0; justify-content: space-around; align-items: baseline; flex-wrap: wrap; }

#topNav ul li { flex-basis: 45%; padding-bottom: 3%; }

#topNav ul li a { display: block; }
#topNav ul li a .on{display: none;}
#topNav ul li a .off{display: block;}
#topNav ul li a:hover .on{display: block !important;}
#topNav ul li a:hover .off{display: none !important;}

#topNav ul li.line2 { flex-basis: 17%; }

#widewrapper { position: relative; }

#contentsArea { background: #fff1ef; padding-bottom: 30px; position: relative; }

#contents.column1 { width: 100%; padding: 0; background: none; }

.w1024 { padding: 3%; }

#part1 { background: url(../images/map.jpg) no-repeat top right; padding: 46% 0 20px; background-size: 80%; }

#part1 h2 { padding: 3%; }

#part1 > p { font-size: 14px; padding: 3%; }

#part1 > p span { display: block; background: #fff; padding: 15px 20px; font-size: 12px; margin-top: 10px; }

#part1 .subttl { background: url(../images/pink.jpg); position: relative; text-align: right; padding: 3% 3% 3% 20%; margin: 10% 0 5%; }

#part1 .subttl:before { content: ""; display: block; position: absolute; left: 10px; bottom: 10px; background: url(../images/ttldeco.png) no-repeat bottom left; width: 90px; height: 46px; background-size: 50%; }

#part1 .subttl.deco2:before { content: ""; display: block; position: absolute; left: 10px; bottom: 10px; background: url(../images/ttldeco02.png) no-repeat bottom left; width: 90px; height: 46px; background-size: 50%; }

#part1 .daeguspot { display: flex; justify-content: space-between; padding: 0 2%; }

#part1 .daeguspot li { flex-basis: 32%; }

#part1 .daeguspot li p { padding-top: 5px; font-size: 13px; }

#part1 .daeguspot li p span { color: #d23367; font-weight: bold; font-size: 20px; display: block; }

#part1 a.mytripbnr { display: block; text-align: center; padding: 40px 0; }

h2.lightpink { background: url(../images/lightpink02.jpg); text-align: center; padding: 5%; position: relative; margin-top: 40px; }

h2.lightpink img.pl1 { left: 0; top: -10px; position: absolute; display: none; }

h2.lightpink img.pl2 { left: 0; top: -20%; position: absolute; width: 25%; }

h2.lightpink img.pr1 { right: 0; top: 50px; position: absolute; display: none; }

h2.lightpink img.pr2 { right: 0; top: -20%; position: absolute; width: 25%; }

ul.ins li { padding-bottom: 3%; }

ul.ins li h3 { color: #d23367; font-size: 24px; }

ul.ins li p { font-size: 14px; padding: 5px 0; }

ul.ins li p span { display: block; padding: 10px; border-bottom: 1px solid #ccc; }

ul.ins li p span:last-child { border-bottom: none; }

.column1 .hotels .htlBox3 .basic { border-bottom: none; }

.column1 .hotels .htlBox3 .area { color: #fff; }

.column1 .hotels .htlBox3 .rank { border: none; padding-top: 0; }

.column1 .hotels .htlBox3 .roomtype { display: flex; justify-content: space-around; margin: 0 20px; }

.column1 .hotels .htlBox3 .roomtype li { width: 23%; }

.column1 .hotels .htlBox3 .roomtype li img { width: 100%; }

.column1 .hotels .htlBox3 .photo { clear: both; width: 90%; float: none; margin: 0 5%; }

.column1 .hotels .htlBox3 .plan li a { border: none; }

.column1 .hotels .htlBox3 .plan li a .price { text-align: center; }

.column1 .hotels .htlBox3 .plan li a .price small { text-align: center; }

.column1 .hotels .htlBox3 .btn li { width: 90%; float: none; margin: 0 auto 5%; }

.column1 .hotels .htlBox3 .btn li a { background: #e37a7c; font-weight: bold; padding: 12px; font-size: 18px; }

.column1 .hotels.hotelwrap .htlBox { border: 1px solid #e37a7c; }

.column1 .hotels.hotelwrap .htlBox .area { background: #e37a7c; }

.column1 .hotels.tourwrap .htlBox { border: 1px solid #16ae97; }

.column1 .hotels.tourwrap .htlBox .area { background: #16ae97; }

.column1 .hotels.tourwrap .htlBox .btn li a { background: #16ae97; }

.column1 #search-box { width: 100%; border: none; margin: 0 auto; }

.column1 p.attention { font-size: 11px; color: #333333; padding-top: 10px; }

h1#search-box-title, .switch { display: none; }

/* cp_right */
.pagetop { position: fixed; right: 0; bottom: 0; z-index: 9999; width: 15%; }

.pagetop a { display: block; }


#part3.lightpink,#part4.lightpink,#part5.lightpink{padding: 0; height: 180px;}




/* 201911 */
#topNav ul li.line3{flex-basis: 22%;}
#part6.lightpink{padding: 0px;}
#cpn-time{margin: 10px auto 0; text-align: center; list-style: 150%; font-size: 16px;}
#cpn-time span{display: block; font-size: 12px; margin: 5px auto 0;}
#bnr700{display: block; margin: 20px auto 0;}
#bnr700:hover{opacity: 0.8;}
#bnr700 img{width: 100%;}
#cpn-time a{color: #bc0000 !important;}

#point-box{width: 100%; margin: 20px auto 0; overflow: hidden;}
#point-box li{margin: 0 0 20px 0;}
#point-box li img{display: block; width: 100%;}
.red-box{display: block; background: url(../images/red-bg.jpg) center no-repeat; background-size: cover; font-size: 16px; color: #fff; text-align: center; padding: 10px 0;}
.red-btn{display: block; margin-top: 10px;}
.red-btn img{display: block; width: 100%;}
.red-btn:hover{opacity: 0.8;}

#cpn-twitter{width: 100%; box-sizing: border-box; margin: 0px auto 0; background-color: #29a2f0; padding: 10px 0 10px 40px; font-size: 16px; color: #fff; position: relative;}
#cpn-twitter::after{display: block; content: "+"; font-size: 18px; line-height: 100%; text-align: center; width: 20px; height: 20px; border: 1px solid #fff; position: absolute; z-index: 9; top: 10px; left: 10px;}
#cpn-twitter.active-submenu::after{content: "-"; font-size: 20px !important;}
#step-box{width: 100%; box-sizing: border-box; background-color: #fff; border: 1px solid #29a2f0; padding: 20px; margin: 0; text-align: center;}
#step-box .pc{display: none;}

#info-box{width: 94%; margin: 20px auto 0; background-color: #fff; padding: 15px; box-sizing: border-box;}
.info-ttl{display: block; padding-bottom: 10px; margin-bottom: 10px; color: #d23367; font-size: 16px; font-weight: bold; text-align: center; border-bottom: 3px solid #d23367;}
.info-txt{display: block; font-size: 13px; line-height: 150%;}