@import url(./reset.css);

/* @font-face {
    font-family: 'Tenada';
} */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-thumb {
    background-color: #2149a68c;
    border-radius: 10px;
}

::-webkit-scrollbar-track {
    background-color: #ddd;
    border-radius: 10px;
    box-shadow: inset 0px 0px 1px white;
}

/* body */
body {
    background-image: url(/img/footer_bg.png);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: 100%;
}

/* header */
header {
    width: 100%;
    position: fixed;
    top: 0;
    border-bottom: 1px solid #fff;
    z-index: 99;
    background-color: #162a5978;
}

header ul {
    position: relative;
    max-width: 1920px;
    width: 100%;
    padding: 1.25rem;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

header ul a {
    color: #fff;
    font-size: 1.25rem;
    font-weight: 600;
}

header ul .logo {
    position: absolute;
    left: 1.25rem;
}

header ul a:nth-child(3) {
    margin: 0 10%;
}

header .menu_btn {
    position: absolute;
    left: 1.25rem;
}

header .menu_btn figure {
    width: 30px;
}

header .menu_close figure {
    width: 30px;
}

/* 반응형 menu */
header .slide-menu {
    background-color: #ffffff;
    color: #000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.25rem 0;
    display: none;
}

header .slide-menu button {
    position: absolute;
    top: 1.25rem;
    right: 1.25rem;
}

header .slide-menu .logo {
    margin-bottom: 1.25rem;
    width: 20%;
}

header .slide-menu a {
    width: 100%;
    display: block;
    padding: 1.25rem;
    text-align: center;
    font-weight: 600;
    border-bottom: 1px solid #ddd;
}

header .slide-menu a:last-of-type {
    border-bottom: 0;
}

header .mobile-menu {
    color: #fff;
    padding: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
}

header .mobile-menu .logo {
    width: 20%;
}

.logo img {
    width: 80%;
}

/* footer */
footer {
    width: 100%;
    background-color: rgba(255, 255, 255, .3);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    font-size: 1rem;
    color: #757575;
    font-weight: 600;
}

footer a {
    margin-right: 1.25rem;
}

@media screen and (max-width:1200px) {
    html {
        font-size: 15px;
    }
}

@media screen and (max-width:767px) {
    html {
        font-size: 14px;
    }

    header ul {
        display: none;
    }

    header .mobile-menu {
        display: block;
        display: flex;
    }
}

@media screen and (max-width:499px) {
    html {
        font-size: 12px;
    }
}

/* main */
main {
    max-width: 1920px;
    width: 100%;
    margin: auto;
    position: relative;
}

.main_title {
    width: 100%;
    position: absolute;
    top: 0;
    height: 100%;
    z-index: 1;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

main p {
    font-size: 1.25rem;
}

h1 {
    font-size: 3.1rem;
    font-family: 'PyeongChangPeace-Bold';
    margin: 1.25rem 0;
}

h1 span {
    font-size: 4.3rem;
}

.weather {
    display: flex;
}

@media screen and (max-width:1200px) {
    .slick-slide img {
        min-height: 400px;
        object-fit: cover;
    }

    h1 {
        font-size: 2rem;
    }

    h1 span {
        font-size: 3rem;
    }

    main p {
        font-size: 1.1rem;
    }
}

@media screen and (max-width:767px) {
    h1 {
        font-size: 1.6rem;
        margin: .5rem 0;
    }

    h1 span {
        font-size: 2.6rem;
    }

}

@media screen and (max-width:499px) {
    .slick-slide img {
        min-height: 270px;
    }
}

/* section_title*/
.section_title {
    width: fit-content;
}

.section_title h2 {
    font-family: 'PyeongChangPeace-Bold';
    font-size: 2.5rem;
    position: relative;
    width: fit-content;
    margin: auto;
    margin-bottom: .5rem;
}

.section_title h2 span {
    color: #2149A6;
}

.section_title p {
    color: #757575;
    font-size: 1.25rem;
}

#location .section_title p {
    margin-bottom: 1rem;
}

#location .section_title {
    margin-bottom: 1.25rem;
}

/* 지역별 업체정보 한눈에 보기 */
#location {
    max-width: 1920px;
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 8rem auto;
    /* border-bottom: 5px solid #6A2A11;
    border-style: dashed; */
    /* padding-left: 20px; */
    padding-bottom: 12.5rem;
}

#location .left,
#location .right {
    width: 50%;
}

/* location left  */
#location .left {
    position: relative;
}

#location .left button {
    position: absolute;
    display: flex;
    align-items: center;
    font-weight: 600;
    color: #2149A6;

}

#location .left button:hover {
    color: #E50077;
    font-weight: 900;
}

.fa-solid,
.fas {
    margin-right: 5px;
}

/* ========= */
/* 소보면 */
#location .left .lo1 {
    left: 15%;
    top: 15%;
}

/* 군위읍 */
#location .left .lo2 {
    left: 33%;
    top: 25%;
}

/* 효령면 */
#location .left .lo3 {
    left: 36%;
    bottom: 40%;
}

/* 우보면 */
#location .left .lo4 {
    left: 46%;
    top: 50%;
}

/* 의형면 */
#location .left .lo5 {
    left: 59%;
    top: 48%;
}

/* 산성면 */
#location .left .lo6 {
    left: 56%;
    top: 65%;
}

/* 부계면 */
#location .left .lo7 {
    left: 47%;
    top: 80%;
}

/* 삼국유사면 */
#location .left .lo8 {
    left: 71%;
    top: 54%;
}

/* ========= */

/* location right */
#location .right {
    display: flex;
    flex-direction: column;
}

#location .map img {
    width: 80%;
}

#location .p {
    position: absolute;
    bottom: 0;
    right: 0;
}

#location .right .section_title figure {
    position: absolute;
    top: -2rem;
    right: -4rem;
    /* transform: rotate(10deg);  */
}

.location_slide_box {
    position: relative;
    margin-right: 1.25rem;
	max-width:250px;
}

.location_slide_box ::after{
    position: relative;
    margin-right: 1.25rem;
	max-width:250px;
}

.location_slide_box p {
    width: 100%;
    position: absolute;
    padding: 1.25rem;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    bottom: 0;
    border-radius: 0 0 10px 10px;
    box-shadow: inset 0px -30px 20px 0px rgba(0, 0, 0, .7);
}

.location_slide_box img {
    border-radius: 10px;
	 width: 220px;
    height: 270px;
    object-fit: cover;
	object-position: center;
}

@media screen and (max-width:1200px) {

    #location {
        flex-direction: column;
    }

    #location .left,
    #location .right {
        width: 100%;
    }

    #location .left {
        margin: 5rem auto;
    }

    #location .section_title {
        position: absolute;
        top: 0;
        width: 100%;
        text-align: center;
    }

    .slick-slide img {
        width: 100%;
    }

    .location_slide {
        padding-left: 1.25rem;
    }

}

@media screen and (max-width:767px) {
    .section_title h2 {
        font-size: 2rem;
    }

    #location .map img {
        width: 100%;
    }

    #location .left button {
        font-size: 1rem;
    }

    /* ========= */
    /* 소보면 */
    #location .left .lo1 {
        left: 8%;
    }

    /* 군위읍 */
    #location .left .lo2 {
        left: 28%;
    }

    /* 효령면 */
    #location .left .lo3 {
        left: 34%;
    }

    /* 우보면 */
    #location .left .lo4 {
        left: 45%;
    }

    /* 의형면 */
    #location .left .lo5 {
        left: 62%;
    }

    /* 삼국유사면 */
    #location .left .lo8 {
        left: 76%;
    }

    /* ========= */
    #location .right .section_title figure img {
        width: 40px;
    }

    #location .p img {
        min-height: 70px;
        object-fit: cover;
        object-position: right;
    }
}

@media screen and (max-width:499px) {

    /* ========= */
    /* 군위읍 */
    #location .left .lo2 {
        left: 27%;
    }

    /* 효령면 */
    #location .left .lo3 {
        left: 31%;
    }

    /* 의형면 */
    #location .left .lo5 {
        left: 60%;
    }

    /* 삼국유사면 */
    #location .left .lo8 {
        left: 74%;
    }

    /* 부계면 */
    #location .left .lo7 {
        left: 45%;
    }

    /* ========= */
    #location {
        padding-bottom: 9rem;
    }

}

/* 테마별업체정보 */
#them {
    width: 100%;
    margin: 8rem auto;
    background-repeat: no-repeat;
    padding: 1.25rem;
    background-size: 100%;
    background-image: url(../img/them_bg.png);
    background-attachment: fixed;
    background-position: bottom;
    background-size: inherit;
    padding-bottom: 20rem;
}

.them_t {
    max-width: 1200px;
    width: 100%;
    margin: auto;
    display: flex;
    align-content: center;
    position: relative;
    justify-content: center;
    margin-bottom: 5rem;
}

.them_t .section_title {
    position: absolute;
    left: 0;
}

.them_t button {
    display: block;

}

.them_t .btn {
    display: flex;
    align-items: center;
}
.them_t .btn .them_btn{
    font-size: 1.25rem;
    font-weight: 600;
    color: #2149A6;
    margin: 0 2rem;
}

/* button 선택 */
.them_t .btn .them_active {
    font-size: 1.25rem;
    font-weight: 600;
    background-color: #2149A6;
    color: #fff;
    border-radius: 1.25rem;
    padding: .9rem 1.25rem;
	    margin: 0 2rem;
}

.them_pick {
    max-width: 1200px;
    width: 100%;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.thembox {
    width: fit-content;
    border-radius: 1.25rem;
    display: flex;
    flex-direction: column;
    width: 28%;
    margin: 5rem 1.25rem;
}

.thembox figure {
    border-radius: 1.25rem 1.25rem 0 0;
    width: 100%;
}

.thembox .txt {
    background-color: #2149A6;
    color: #fff;
    padding: 1.25rem;
    border-radius: 0 0 1.25rem 1.25rem;
}

.thembox .txt h3 {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 120%;
    margin-bottom: 5px;
}

.thembox .txt p {
    font-size: .9rem;
    line-height: 120%;
}

.thembox .txt p b {
    font-weight: 600;
}

.thembox figure img {
    border-radius: 1.25rem 1.25rem 0 0;
    width: 336px;
    height: 434px;
    object-fit: cover;
    object-position: center;
}

.them_pick .thembox:nth-child(2),
.them_pick .thembox:nth-child(5),
.them_pick .thembox:nth-child(8),
.them_pick .thembox:nth-child(11) {
    margin-top: 20%;
}

@media screen and (max-width:1200px) {
    #them {
        margin-top: 15rem;
    }

    .them_pick {
        width: 80%;
    }

    .thembox {
        margin: 3rem 0;
        width: 30%;
    }

    .them_t .section_title {
        width: 100%;
        top: -8rem;
        text-align: center;
    }
	.thembox figure img{
	height:250px;}
}

@media screen and (max-width:767px) {
    .them_pick {
        width: 100%;
    }

    .thembox {
        width: 32%;
    }

    .them_t .btn button {
        margin: 0 1rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    .them_t .btn {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media screen and (max-width:499px) {
    .thembox {
        width: 48%;
        margin-top: 0;
    }

    .them_pick .thembox:nth-child(2),
    .them_pick .thembox:nth-child(5),
    .them_pick .thembox:nth-child(8),
    .them_pick .thembox:nth-child(11) {
        margin-top: 0;
    }

    #them {
        padding-bottom: 15rem;
    }

    .thembox .txt p {
        font-size: 1rem;
    }
}

/* 공지사항 & 자주하는 질문 */
#community {
    max-width: 1200px;
    width: 100%;
    margin: 5rem auto;
    background-repeat: no-repeat;
    margin-bottom: 15rem;
    padding: 1.25rem;
}

.combtn {
    width: 100%;
    border-bottom: 1px solid #BFBFBF;
    display: flex;
    align-items: center;
    position: relative;
}

.combtn a {
    position: absolute;
    right: 0;
}

.combtn button {
    font-size: 1.25rem;
    color: #000;
    font-weight: 600;
    padding-bottom: 1rem;
    display: block;
}

.combtn button:first-child {
    color: #2149A6;
    border-bottom: 2px solid #2149A6;
    margin-right: 1.25rem;
}

/* 공지사항 */
#community .list {
    padding: 1.25rem 0;
    border-bottom: 1px solid #BFBFBF;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#community .notice .date {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 10%;
}

#community .date p {
    color: #2149A6;
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 5px;
}

#community .date span {
    color: #6D6D6D;
    font-size: .9;
}

#community .com_txt {
    width: 88%;
    max-height: 85px;
    overflow-y: scroll;
}

#community .com_txt p {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: .8rem;
}

#community .com_txt span {
    color: #757575;
    line-height: 120%;
}

/* 자주하는질문 */
#community .faq {
    display: none;
}

#community .faq .list {
    width: 100%;
}

#community .faq .com_txt>span {
    display: flex;
    align-items: center;
}

#community .faq .list .q {
    color: #2149A6;
    font-weight: 600;
    font-size: 1.25rem;
    margin-right: .8rem;
}

#community .faq .com_txt {
    width: 100%;
	    overflow-y: unset;
}

#community .faq .list .a {
    margin-right: 1rem;
    display: block;
    width: 2rem;
    height: 2rem;
    background-color: #2149A6;
    color: #ddd;
    border-radius: 300%;
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center;
    line-height: 2rem;
}

@media screen and (max-width:499px) {
    #community .com_txt {
        width: 85%;
    }

    #community .com_txt {
        max-height: 60px;
    }

}

/* 서브페이지  visual*/
.visual {
    max-width: 1920px;
    width: 100%;
    margin: auto;
}

/* ===============숙박업체 상세정보================= */
.information {
    max-width: 1920px;
    width: 100%;
    margin: auto;
    position: relative;
    margin-bottom: 20rem;
    overflow: hidden;
}

.commu {
    max-width: 1920px;
    width: 100%;
    margin: auto;
    position: relative;
    overflow: hidden;
}

.information .bg figure {
    position: absolute;
    z-index: -2;
}

.information .bg1 {
    top: 20%;
}

.information .bg2 {
    top: 20%;
    right: 0;
}

/* 숙박업체 이름 */
.information .title {
    max-width: 1920px;
    width: 100%;
    margin: auto;
    border-bottom: 1px solid #d9d9d9;
    font-weight: 600;
    text-align: center;
    background-color: #fff;
    margin-bottom: 9rem;
    position: relative;
    top: -2rem;
    border-radius: 1.25rem 1.25rem 0 0;
}

.information .title h2 {
    max-width: 1200px;
    width: 100%;
    border-bottom: 3px solid #2149A6;
    margin: auto;
    font-size: 2.5rem;
    padding: 1.25rem;
}

.information h3 {
    font-size: 1.8rem;
    border-bottom: 3px solid #2149A6;
    font-weight: 600;
    padding-bottom: 10px;
    width: fit-content;
    height: fit-content;
    margin: auto;
    margin-bottom: 3.1rem;
}

.information .info {
    max-width: 1200px;
    width: 100%;
    margin: auto;
}

/* 숙박 정보 이미지*/
.i_img {
    width: 100%;
    margin: auto;
    background-color: #fff;
    position: relative;
}

.bear {
    position: absolute;
    top: -117px;
    right: 0;
    z-index: -1;
}

.i_img .img img {
    border-radius: 1.25rem;
        min-height: 150px;
        max-height: 500px;
		    width: 1200px;
        object-fit: cover;
        object-position: center;
}

.i_img .img {
    margin-bottom: 3rem;
}

/* 숙박업체 소개. 정보 */
.i_box {
    width: 100%;
    margin: auto;
    border-radius: 1.25rem;
    border: 1px solid #d9d9d9;
    margin-bottom: 10rem;
}
.i_box h2{
    font-size: 1.25rem;
    background-color: #2149A6;
    color: #fff;
    font-weight: 600;
    text-align: center;
    padding: 1.25rem;
    border-radius: 1.25rem 1.25rem 0 0 ;
}
.i_box h3{
    font-size: 1.25rem;
    font-weight: 600;
    border-bottom: none;
    margin-bottom: 1.25rem;
}
.i_box .btn {
    width: 100%;
    border-radius: 1.25rem 1.25rem 0 0;
    display: flex;
    align-items: center;
    background-color: #d9d9d9;
}

.i_box .btn button {
    width: 50%;
    font-size: 1.25rem;
    font-weight: 600;
    color: #757575;
    padding: 1.25rem;
    border-radius: 1.25rem 1.25rem 0 0;
}

.i_box .btn button:nth-child(1) {
    background-color: #2149A6;
    color: #fff;
}

.i_box>a {
    width: 100%;
    border-top: 1px solid #d9d9d9;
    padding: 1.25rem;
    display: block;
    font-weight: 600;
    color: #2149A6;
    font-size: 1.25rem;
    text-align: center;
}
.i_box a i{
margin-right:1rem;
}
.i_box .int,
.i_box .inf, .i_box .them, .i_box .inquire{
    height: 100%;
    display: block;
    padding: 5rem 1.25rem;
    text-align: center;
    font-size: 1.1rem;
    line-height: 130%;
    width: 96%;
    margin: auto;
    border-bottom: 1px solid #d9d9d9;
}
.i_box .inquire{
    border-bottom: none;
}
.i_box .inquire a{
    width: fit-content;
	 margin: auto;
    color: #000;
    border-top: 0;
    display: block;
    margin-bottom: 5px;
}
.i_box .them p{
        display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 1.25rem ;
}
.i_box .them p i{
    color: #757575;
    font-size: 2.3rem;
    margin-bottom: 1.25rem;
}
.i_box .them .them_1{
    display: flex;
    align-items: center;
    justify-content: center;
	flex-wrap: wrap;

}
.information #slide {
    margin-bottom: 10rem;
}

/* .information #slide .img {
    width: 1600px;
    margin-left: -10px;
} */
.information #slide .img img{
    border-radius: 1.25rem;
	width: 380px;
    height: 300px;
    object-fit: cover;
    object-position: center;
}
.information .lo iframe {
    display: block;
    margin: auto;
    margin-bottom: 1.25rem;
}

.information .lo p {
    font-size: 1.1rem;
}
.information .lo button{
    width: 100%;
    background-color: #fff;
    border: 1px solid #757575;
    border-radius: 10px;
    padding: 5px;
    color: #757575;
    margin: 20px 0;
}
.information .lo p i {
    color: #2149A6;
    margin-right: 1.25rem;
    font-weight: 600;
    font-size: 1.5rem;
}

@media screen and (max-width:1200px) {
    .information .info {
        padding: 2rem;
    }
    .information .title h2 {
        width: 90%;
    }
    .information #slide .img {
        width: 100%;
        margin: auto;
    }

    #slide .slick-slide img {
        width: 98%;
    }
}

@media screen and (max-width:767px) {
    .information{
        margin-bottom: 10rem;
    }
    .information .title h2 {
        font-size: 2rem;
    }

    .information .title {
        margin-bottom: 5rem;
    }
        .bear img {
        width: 70%;
    }

    .bear {
        top: -75px;
        right: -20px;
    }
}
@media screen and (max-width:499px){
    .bear img{
        width: 50%;
    }
    .bear{
        top: -58px;
    }
    .information .title{
        margin-bottom: 1rem;
    }
    .i_box .int, .i_box .inf, .i_box .them{
        padding: 3rem 1.25rem;
    }
}
@media screen and (max-width:320px){
    .i_box .int p {word-break: keep-all;}
}

/* 업체정보 페이지 */
#info {
    max-width: 1920px;
    width: 100%;
    margin: auto;
    margin-bottom: 15rem;
    overflow: hidden;
}

.hd-wrap {
    position: relative;
}

.hd-wrap .main_title {
    width: 100%;
    position: absolute;
    top: 0;
    height: 100%;
    z-index: 1;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

.hd-wrap h2 {
    font-size: 3.8rem;
    font-weight: 600;
    margin-bottom: 1.25rem;
}

.hd-wrap p {
    font-size: 1.25rem;
    line-height: 120%;
}

/* visual */

#info .lnb-wrap {
    width: 100%;
    border-bottom: 1px solid #d9d9d9;
    font-weight: 600;
    text-align: center;
    background-color: #fff;
    margin-bottom: 2rem;
    position: relative;
    top: -1rem;
    border-radius: 1.25rem 1.25rem 0 0;
}

#info .lnb-wrap .lnb-btn {
    max-width: 1200px;
    width: 100%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#info .lnb-wrap button {
    font-size: 1.25rem;
    font-weight: 600;
    padding: 1.25rem 0;
    width: 20%;
	color:#000;
}

#info .lnb-wrap .on {
    color: #2149A6;
    border-bottom: 2px solid #2149A6;
}

#info .lnb-wrap button:active {
    color: #2149A6;
    border-bottom: 2px solid #2149A6;
}

#info .content {
    max-width: 1200px;
    width: 100%;
    margin: auto;
}

@media screen and (max-width:1200px) {
    #info .content {
        padding: 2rem;
    }
}
/* @media screen and (max-width:499px){
    #info .lnb-wrap button:nth-child(1) {
        border-bottom: 1.5px solid #2149A6;
    }
    #info .lnb-wrap button:active {
        border-bottom: 1.5px solid #2149A6;
    }
}
 */
#info form {
    width: 100%;
    margin: auto;
    position: relative;
    padding: 1rem 1.25rem;
    border: 1px solid #d9d9d9;
    border-radius: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#info form input {
    width: 95%;
}

#info form .submit_btn {
    font-size: 1.25rem;
    font-weight: 600;
	color:#000;
}

/* 테마 버튼 */
#info .them_btn {
    width: 100%;
    margin: 1.25rem auto;
    padding-bottom: 1.25rem;
    display: flex;
	flex-wrap: wrap;

    margin-bottom: 3.1rem;
}

#info .them_btn::-webkit-scrollbar {
    height: 5px;
}

#info .them_btn button {
    background-color: #eaeaea;
    color: #757575;
    padding: 5px 10px;
    border-radius: 1.25rem;
    font-size: 14px;
    min-width: fit-content;
    margin-right: 1.25rem;
}

#info .them_btn button:last-child {
    margin-right: 0;
}

#info .them_btn button:active {
    background-color: #2149A6;
    color: #fff;
}

#info .content>p {
    font-size: 1.2rem;
    margin-bottom: 1.25rem;
}

#info .content>p span {
    color: #2149A6;
    font-weight: 600;
}

#info .container {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

#info .container .cont-box {
    width: 49%;
    border: 1px solid #d9d9d9;
    display: flex;
    border-radius: 1.25rem;
    flex-direction: column;
    margin-bottom: 1%;
    padding: 1.25rem;
}

#info .container .cont-box img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    object-position: center;
}

#info .container .cont-box h3 {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 1.25rem 0;
}

@media screen and (max-width:1200px) {
 .hd-wrap h2 {
        font-size: 3rem;
    }
    #info .content{
        padding: 1.5rem;
    }
 .hd-wrap p {
        font-size: 1rem;
    }
    #info .lnb-wrap{
        margin-bottom: 0;
    }
        #info .container .cont-box{
        padding: 1rem;
        margin-bottom: 2%;
    }
    #info{
        margin-bottom: 10rem;
    }
     #info .container .cont-box h3{
        font-size: 1.2rem;
    }
}
@media screen and (max-width:767px){
	#info .container .cont-box img{
	height: 140px;
	}
}
@media screen and (max-width:499px){
    .hd-wrap h2 {
        font-size: 2.5rem;
    }
    #info .lnb-wrap button{
        font-size: 16px;
    }
    #info .them_btn::-webkit-scrollbar{
        height: 3px;
    }
} 
.pg_wrap {
    clear: both;
    margin: 30px 0;
    text-align: center;
}
/* .pg_start {
    text-indent: -999px;
    overflow: hidden;
    padding: 15px 20px;
    border: 1px solid #aaa;
} */
.pg_page {
    color: #828282;
    font-size: 12px;
    padding: 15px 20px;
    display: inline-block;
    vertical-align: middle;
    background: #f5f5f5;
    border: 1px solid #f5f5f5;
    font-size: 12px;
    border-radius: 10px;
}
.pg_current {
    display: inline-block;
    background: #2149A6;
    color: #fff;
    font-weight: bold;
    padding: 15px 20px;
    border-radius: 10px;
}
.pg_start, .pg_end{
    background:none;
    border: none;
}
@media screen and (max-width:499px) {
    .pg_current, .pg_page{
        padding: 10px 15px;
    }
}