@charset "UTF-8";

/* 공용부 */
*{
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-touch-callout: none;
	-webkit-user-select:none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overscroll-behavior-y: none;
	-webkit-overflow-scrolling: auto;
    scrollbar-width: none;
    scrollbar-color: transparent;
	touch-action: pan-x pan-y;
}

/*
// 이걸 적용하면 safari 주소표시줄은 사라지지 않지만, sticky-tabs 의 비정상적인 동작과 scroll 감지를 못한다는 단점이 있음
// 최신 웹사이트는 기본적으로 safari 주소표시줄이 사라지도록 설계되어있음(예시:네이버 모바일웹)
html,
body{
  height: 100%;
  overflow-x: hidden;
}
*/

/* 가로 스크롤 차단 */
html, body {
  overscroll-behavior-x: none;
}
* {
  box-sizing: border-box;
}



/* 폰트 */
@font-face {
  font-family: "PhotoStudio";
  src: url("../fonts/PhotoStudio/PhotoStudioL.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "PhotoStudio";
  src: url("../fonts/PhotoStudio/PhotoStudioM.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "PhotoStudio";
  src: url("../fonts/PhotoStudio/PhotoStudioB.woff") format("woff");
  font-weight: 600;
  font-style: normal;
}
font-face {
  font-family: "PhotoStudio";
  src: url("../fonts/PhotoStudio/PhotoStudioBB.woff") format("woff");
  font-weight: 800;
  font-style: normal;
}


@font-face {
    font-family: 'Spoqa Han Sans Neo';
    font-weight: 500;
    src: local('Spoqa Han Sans Neo Medium'),
    url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Medium.woff2') format('woff2'),
}

@font-face {
    font-family: 'Spoqa Han Sans Neo';
    font-weight: 400;
    src: local('Spoqa Han Sans Neo Regular'),
    url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Regular.woff2') format('woff2'),
}

@font-face {
    font-family: 'Ownglyph_JAEGEONSA-Rg';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/2405-2@1.0/Ownglyph_JAEGEONSA-Rg.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

/* common */
body{color:#111827; font-size:14px; font-family:"Spoqa Han Sans Neo", 'sans-serif'; overflow-x:hidden;background-color:#FFF8F7}
:not(.overflow-x-auto){scrollbar-width:none;-ms-overflow-style:none;}
:not(.overflow-x-auto)::-webkit-scrollbar{display:none;}

*{word-break:keep-all;}
a,a:active,a:hover,a:link,a:visited,a:focus{text-decoration:none}
.nav-link{padding:0;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{margin-bottom:0; color:#111827;}

main h2{font-size:20px; font-weight:700; line-height:28px;}
main h3{margin-top:24px; font-size:16px; font-weight:600; line-height:22px;}
main h4{font-size:16px; font-weight:600; line-height:22px;}
main h5{margin-top:8px; font-size:15px; font-weight:500; line-height:24px;}

.sub main h4{font-size: 1.4em; font-weight:600; line-height:1.8em}

p{margin-bottom:0;}
ul{margin-bottom:0; padding-left:0; list-style:none;}

button{padding:0; border-width:0; background-color:transparent;}
.btn{font-size:15px;width:100%; margin:0; padding:13px 20px; border-radius:16px; font-weight:400;}
.btn-primary{border-color:#2563eb; background-color:#2563eb;}
.btn-secondary{border-color:#e5e7eb; background-color:#e5e7eb; color:#1f2937 !important;}
.btn.btn-primary:hover{border-color:#60a5fa; background-color:#60a5fa;}
.btn.btn-primary:active{border-color:#1e40af !important; background-color:#1e40af !important;}
.btn.btn-primary:disabled{border-color:#9ca3af; background-color:#9ca3af;}
.btn.btn-secondary:hover{border-color:#f3f4f6; background-color:#f3f4f6;}
.btn.btn-secondary:active{border-color:#9ca3af !important; background-color:#9ca3af !important;}
.btn.btn-secondary:disabled{border-color:#e5e7eb; background-color:#e5e7eb;}

.form-control{width:100%; padding:13px 16px; border-color:#e5e7eb; border-radius:16px; color:#111827; font-size:16px; line-height:22px;}
.form-control:focus{border-color:#2563eb; box-shadow:none !important;}
.form-control.is-invalid{border-color:#dc2626;}
.invalid-feedback{margin-top:4px; padding:0 8px; color:#dc2626; font-size:13px;}
.form-control::placeholder{color:#9ca3af;}
.form-select{width:100%; padding:13px 38px 13px 16px; border-color:#e5e7eb; border-radius:16px; background-size:16px; color:#111827; font-size:16px; line-height:22px;}
.form-select:focus{border-color:#2563eb; box-shadow:none !important;}
.form-select::placeholder{color:#9ca3af;}
.form-check{position:relative; margin:0 24px 0 0; padding-left:0;}
.form-check .form-check-input{position:absolute; top:2px; left:3px; margin-left:0;}
.form-check .form-check-label{position:relative; color:#111827; font-size:16px; line-height:24px; cursor:pointer;}
.form-check .form-check-label:before{position:absolute; top:0; left:0; bottom:0; margin:auto 0; background-repeat:no-repeat; background-size:100%; content:'';}
.form-check .form-check-input[type="checkbox"]{left:5px;}
.form-check .form-check-input[type="checkbox"] + .form-check-label{padding-left:32px;}
.form-check .form-check-input[type="checkbox"] + .form-check-label:before{width:24px; height:24px; background-image:url('../images/sub/ico_checkbox.webp');}
.form-check .form-check-input[type="checkbox"]:checked + .form-check-label:before{background-image:url('../images/sub/ico_checkbox-checked.webp');}
.form-check .form-check-input[type="radio"] + .form-check-label{padding-left:28px;}
.form-check .form-check-input[type="radio"] + .form-check-label:before{width:20px; height:20px; background-image:url('../images/sub/ico_radio.webp');}
.form-check .form-check-input[type="radio"]:checked + .form-check-label:before{background-image:url('../images/sub/ico_radio-checked.webp');}

/* layout */
.container{max-width:100%; padding:0 20px;}
.wrapper .side{display:none;}
.wrapper .page {
  max-width: 482px;
  margin: 0 auto;
  height: auto;           /* 고정 높이 없애기 */
  min-height: 100vh;      /* 화면보다 짧으면 화면 높이만큼은 차지 */
  box-sizing: border-box; /* padding, border가 크기에 포함되도록 */
  display: flex;
  flex-direction: column; /* 하단 고정 요소를 밀어내기 위해 */
  border-left: 1px solid #e0e0e0;
  border-right: 1px solid #e0e0e0;
}
#main.wrapper .page{background-color:#f9fafb;}
#main.wrapper .sub{background-color:#fff;}
section{overflow:hidden;}

/* header */
.main #header .navbar{--bs-navbar-padding-y:0;}
.sub #header .navbar{--bs-navbar-padding-y:0;border-bottom:1px solid #e5e7eb;}
#header .navbar .container{height:60px;}
#header .navbar h1{margin-bottom:0;}
#header .navbar h1 span{display:block; color:#111827; font-size:20px; font-weight:700; line-height:28px;}
#header .navbar .nav-sub{display:flex; position:relative; width:100%; padding:16px 0; justify-content:space-between;}
#header .navbar .nav-sub .nav-btn{width:24px; height:24px; background-repeat:no-repeat; background-position:center; background-size:100%; font-size:0;}
#header .navbar .nav-sub .nav-btn.prev{background-image:url('../images/sub/ico_prev.webp');}
#header .navbar .nav-sub .nav-btn.home{background-image:url('../images/sub/ico_home.webp');}
#header .navbar .nav-sub .nav-title{overflow:hidden; position:absolute; top:16px; left:34px; right:34px; bottom:16px; width:calc(100% - 68px); font-size:18px; text-align:center; text-overflow:ellipsis; line-height:24px; white-space:nowrap;}
#header .navbar .nav-sub .nav-title img{height:24px;}

/* footer */
#footer{padding:20px 0 40px 0; border-top:1px solid #e5e7eb;}
#footer .footer-company{color:#4b5563; font-size:13px; font-weight:500; line-height:18px;}
#footer .footer-info{margin-top:6px; font-size:0;}
#footer .footer-info span{display:inline-block; margin-top:2px; color:#4b5563; font-size:12px; line-height:16px; vertical-align:top;}
#footer .footer-info span + span{margin-left:12px;}

/* modal */
.modal .modal-dialog{width:271px; margin:20px auto;}
.modal .modal-content{border-radius:16px; color:#111827;}
.modal .modal-header{padding:18px 20px; border-bottom:0;}
.modal .modal-header .modal-title{font-size:18px;}
.modal .modal-header .btn-close{opacity:1;}
.modal .modal-body{padding:16px;}
.modal .modal-body .modal-list .list-item .list-link{display:flex; height:56px; padding:0 20px; color:#374151; font-size:16px; line-height:22px; align-items:center;}
.modal .modal-body .modal-list .list-item .list-link:hover{background-color:#eff6ff;}
.modal .modal-body .modal-form-list{display:flex; padding:0 20px; flex-wrap:wrap;gap:12px;}
.modal .modal-body .modal-form-list .list-item{position:relative; width:calc(50% - 6px);}
.modal .modal-body .modal-form-list .list-item input{position:absolute; top:10px; left:10px;}
.modal .modal-body .modal-form-list .list-item label{display:flex; position:relative; height:48px; padding:0 16px; border:1px solid #e5e7eb; border-radius:16px; background-color:#fff; color:#374151; font-size:16px; line-height:22px; cursor:pointer; align-items:center;}
.modal .modal-body .modal-form-list .list-item input:checked + label{border-color:#2563eb;}
.modal .modal-body .modal-dialog-title{margin-top:12px; font-size:18px; font-weight:600; text-align:center;}
.modal .modal-body .modal-dialog-text{margin-top:4px; font-size:15px; text-align:center; line-height:24px;}
.modal .modal-footer{padding-top:0; border-top:0; gap:8px;flex-wrap:nowrap;}
.modal .modal-footer .btn{padding-top:11px; padding-bottom:11px; border-radius:12px;}
.modal.modal-bottom .modal-dialog{position:absolute; left:0; right:0; bottom:0; bottom:-100%; width:100%; max-width:480px; margin:0 auto; transition-property:all;}
.modal.modal-bottom.show .modal-dialog{bottom:0;}
.modal.modal-bottom .modal-dialog .modal-content{border-radius:24px 24px 0 0;}
.modal.modal-bottom .modal-body{padding:0 0 40px 0;}

/* main */
.page main{padding-bottom:60px;}
.sub main{padding-bottom:100px;}
/*.input main{padding-bottom:20px;}*/
.input main{padding-bottom:0px;}
.tarot main{padding-bottom:10px;}
section{position:relative;}

.card{margin-top:16px; padding:24px 20px; border:0; border-radius:16px; box-shadow:0 2px 12px 0 rgba(0, 0, 0, 0.08); gap:24px;}
h3 + .card{margin-top:12px;}
.card .card-tab{display:flex; gap:25px;}
.card .card-tab .tab-item{position:relative;}
.card .card-tab .tab-item + .tab-item:before{position:absolute; top:0; left:-12px; bottom:0; width:1px; height:12px; margin:auto 0; background-color:#9ca3af; content:'';}
.card .card-tab .tab-item .tab-link{color:#9ca3af; font-size:16px; line-height:22px;}
.card .card-tab .tab-item .tab-link.active{color:#2563eb; font-weight:600;}

.icon-list{display:flex; flex-direction:column;gap:24px;}
.icon-list .list-link{display:flex; position:relative; min-height:48px; padding-left:60px; text-align:left; flex-direction:column;justify-content:center;}
.icon-list .list-link .list-img{position:absolute; top:0; left:0; width:48px; height:48px; border-radius:50%; background-color:#f9fafb;}
.icon-list .list-link .list-img img{position:absolute; top:0; left:0; right:0; bottom:0; width:28px; margin:auto;}
.icon-list .list-link .list-title{color:#111827; font-size:16px; font-weight:600; line-height:22px;}
.icon-list .list-link .list-text{margin-top:4px; color:#374151; font-size:14px; line-height:20px;white-space: normal;word-break: break-all;}

.img-list-wrap{margin:12px -20px 0 -20px; padding:0 20px 12px 20px;}
.img-list{display:flex; white-space:nowrap; gap:12px;}
.img-list .list-item span{display:block; white-space:normal;}
.img-list .list-item .list-link{display:block; width:152px;}
.img-list .list-item .list-link .list-img{overflow:hidden; border-radius:16px;}
.img-list .list-item .list-link .list-img img{width:100%;}
.img-list .list-item .list-link .list-title{margin-top:8px; color:#111; font-size:16px; font-weight:600; line-height:22px;}
.img-list .list-item .list-link .list-text{margin-top:4px; color:#374151; font-size:14px; line-height:20px;}

.icon-list2-wrap{margin:12px -20px 0 -20px; padding:0 20px 12px 20px;}
.icon-list2{display:flex; white-space:nowrap; gap:12px;}
.icon-list2 .list-item .list-link{display:block; position:relative; width:152px; height:154px; padding:16px; border-radius:16px; background-color:#fff; box-shadow:0 2px 12px 0 rgba(0, 0, 0, 0.08);}
.icon-list2 .list-item .list-link span{display:block; white-space:normal;}
.icon-list2 .list-item .list-link .list-img{position:relative; width:48px; height:48px; border-radius:50%; background-color:#f9fafb;}
.icon-list2 .list-item .list-link .list-img img{position:absolute; top:0; left:0; right:0; bottom:0; width:28px; margin:auto;}
.icon-list2 .list-item .list-link .list-title{overflow:hidden; margin-top:8px; color:#111827; font-size:16px; font-weight:600; text-overflow:ellipsis; line-height:22px; white-space:nowrap;}
.icon-list2 .list-item .list-link .list-text{display:-webkit-box; overflow:hidden; height:40px; margin-top:4px; color:#374151; font-size:14px; text-overflow:ellipsis; line-height:20px; -webkit-box-orient:vertical; -webkit-line-clamp:2;white-space: normal;word-break: break-all;}

section.bg-white .card{background-color:#f3f4f6; box-shadow:none;}
section.bg-white .icon-list .list-link .list-img{background-color:#fff;}

#banner .swiper-wrapper{border-radius:16px;}
#banner .swiper-slide .check-link{display:block; overflow:hidden; position:relative; width:100%; height:152px; padding:20px 160px 20px 20px; background-color:#9ca3af; text-align:left;}
#banner .swiper-slide.bg-pink .check-link{background-color:#f274b1;}
#banner .swiper-slide.bg-purple .check-link{background-color:#a274f2;}
#banner .swiper-slide.bg-blue .check-link{background-color:#74a2f2;}
#banner .swiper-slide.bg-yellow .check-link{background-color:#f2ca74;}
#banner .swiper-slide.bg-green .check-link{background-color:#86E57F;}
#banner .swiper-slide.bg-pink span{display:block; width:100%; color:#fff; line-height:1.4;}
#banner .swiper-slide.bg-purple span{display:block; width:100%; color:#fff; line-height:1.4;}
#banner .swiper-slide.bg-blue span{display:block; width:100%; color:#fff; line-height:1.4;}
#banner .swiper-slide.bg-yellow span{display:block; width:100%; color:#000; line-height:1.4;}
#banner .swiper-slide.bg-green span{display:block; width:100%; color:#000; line-height:1.4;}
#banner .swiper-slide .check-link .text-type{font-size:14px;}
#banner .swiper-slide .check-link .text{display:-webkit-box; overflow:hidden; height:50px; margin-top:2px; font-size:18px; font-weight:600; text-overflow:ellipsis; line-height:25px; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
#banner .swiper-slide .check-link .tag{display:flex; margin-top:19px; gap:4px;}
#banner .swiper-slide .check-link .tag span{display:inline-block; width:auto; padding:0 6px; border-radius:4px; color:#fff; background-color:#374151; font-size:12px; line-height:21px;}
#banner .swiper-slide .check-link .slide-img{position:absolute; top:4px; right:0; bottom:4px; width:auto;}
#banner .swiper-slide .check-link .slide-img img{max-height:100%;}
#banner .carousel-indicators{position:relative; left:auto; right:auto; bottom:auto; margin:2px 0 0 0;}
#banner .carousel-indicators button{opacity:.1; width:8px; height:8px; margin:0 4px; border-radius:50%; background-color:#161320;}
#banner .carousel-indicators button.active{opacity:1; background-color:#111827;}

.nav{overflow:hidden; background-color:#f9fafb;}
.nav:before{position:absolute; left:50%; bottom:0; width:100vw; height:1px; background-color:#e5e7eb; content:''; transform:translateX(-50%);}
.nav .nav-list{display:flex; white-space:nowrap; gap:8px;}
.nav .nav-item .nav-link{position:relative; padding:0 4px; color:#9ca3af; font-size:16px; font-weight:600; line-height:46px; transition:color .25s ease-in-out;}
.nav .nav-item .nav-link:before{position:absolute; left:50%; bottom:0; width:0; height:2px; background-color:#111827; content:''; transform:translateX(-50%); transition:width .25s ease-in-out;}
.nav .nav-item .nav-link.active{color:#111827;}
.nav .nav-item .nav-link.active:before{width:100%;}

#my{padding-top:24px; padding-bottom:30px;}
#tarot{padding-top:24px; padding-bottom:30px;}
#special{padding-top:30px; padding-bottom:30px;}
#saju{padding-top:30px; padding-bottom:28px;}

/* sub */

#form{padding-top:8px;}
#form form{height:100%;}
#form form fieldset{height:100%; overflow-x:hidden;overflow-y:auto;}
#form form .form-wrap{display:flex; flex-direction:column;gap:20px;margin-bottom:10px;}
#form form .form-wrap .form-box .form-label{margin-bottom:8px; font-size:14px; font-weight:600; line-height:20px;}
#form form .form-wrap .form-box .form-inp{display:flex; gap:8px;}
#form form .form-wrap .form-box .form-inp .form-inp-box{width:100%;}
#form form .form-wrap .form-box.birth .form-inp .form-inp-box:nth-child(1){width:calc(100% - 104px);}
#form form .form-wrap .form-box.birth .form-inp .form-inp-box:nth-child(2){width:96px;}
#form form .form-wrap .form-box.birthTime .form-inp .form-inp-box .form-control{background-image:var(--bs-form-select-bg-img),var(--bs-form-select-bg-icon,none); background-repeat:no-repeat; background-position:right .75rem center; background-size:16px; --bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");}
#form form .form-btn-wrap{position:fixed; left:0; right:0; bottom:0; max-width:480px; margin:0 auto; padding:15px 20px 32px 20px; background-color:#fff;border-top: 0.1px solid #ccc;}
#form form .form-btn-wrap .form-text{margin-top:14px; color:#374151; font-size:12px; line-height:15px;white-space: normal;word-break: break-all;}
#form form .form-btn-wrap .form-btn{margin-top:28px;}

#detail{padding-top:8px;}
#detail .detail-list{display:flex; flex-direction:column;gap:32px;}
#detail h3{margin-top:0;}
#detail h3 + .detail-list{margin-top:20px;}
#detail .detail-item p{margin-top:4px; font-size:17px; line-height:1.8em;white-space: normal;word-break: break-all;}
#detail .detail-item .tag-list{display:flex; margin-top:12px; flex-wrap:wrap;gap:8px;}
#detail .detail-item .tag-list li{padding:3px 12px; border:1px solid #2563eb; border-radius:14px; color:#2563eb; font-size:14px; line-height:20px;}
#detail .detail-item .card-list{display:flex; margin-top:12px; padding:16px; border-radius:12px; background-color:#f3f4f6; flex-wrap:wrap;}
#detail .detail-item .card-list li{display:flex; width:100%; color:#374151; font-size:15px; line-height:24px; gap:8px;}
#detail .detail-item .card-list li span{font-weight:500;}
#detail .detail-item .card-list.half li{width:50%;}
#detail .detail-item .card-comment{position:relative; margin-top:12px; padding:16px 36px; border-radius:12px; background-color:#eff6ff; font-size:15px; text-align:center; line-height:24px;}
#detail .detail-item .card-comment:before{position:absolute; top:16px; width:20px; height:20px; background:url('../images/sub/ico_comment_1.webp') no-repeat center / 100%; content:'';}
#detail .detail-item .card-comment:after{position:absolute; top:16px; width:20px; height:20px; background:url('../images/sub/ico_comment_2.webp') no-repeat center / 100%; content:'';}
#detail .detail-item .card-comment:before{left:16px;}
#detail .detail-item .card-comment:after{right:16px;}
#detail .detail-item .dot-list{margin-top:12px;}
#detail .detail-item .dot-list li{position:relative; padding-left:24px; color:#374151; font-size:15px; line-height:24px;}
#detail .detail-item .dot-list li:before{position:absolute; top:10px; left:9px; width:3px; height:3px; border-radius:50%; background-color:#374151; content:'';}
#detail .detail-list.type2{gap:20px;}
#detail h3 + .detail-list.type2{margin-top:16px;}
#detail .detail-list.type2 .detail-item{padding:16px; border-radius:16px; background-color:#eff6ff;}
#detail .detail-list.type2 .detail-item .tag-list li{border-color:#4b5563; background-color:#4b5563; color:#fff;}
#detail .detail-list.type2 .detail-item .card-list{background-color:#fff;}
#detail .detail-list.type2 .detail-item .card-comment{margin-top:8px; padding:0 20px;}
#detail .detail-list.type2 .detail-item .card-comment:before,
#detail .detail-list.type2 .detail-item .card-comment:after{top:0;}
#detail .detail-list.type2 .detail-item .card-comment:before{left:0;}
#detail .detail-list.type2 .detail-item .card-comment:after{right:0;}


#swiperOverlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1100;
  display: none;
  justify-content: center;
  align-items: center;
}

#swiperOverlay.active {
  display: flex;
}


/* 심리테스트 하단 네비 */
.bottom-nav {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  max-width: 480px;
  margin: 0 auto;
  background: #fff;
  border-top: 1px solid #DDD;
  box-shadow: 0 -2px 4px rgba(0,0,0,0.05);

  display: flex;
  flex-direction: column;
  padding: 0.75rem 1rem;
  z-index: 1000;
}
.bottom-nav .page-info {
  flex: 1;
  text-align: center;
  margin-left: auto;
}
.bottom-nav button {
  background: none;
  border: none;
  font-size: 1rem;
  font-weight: 500;
}
.bottom-nav button:disabled {
  color: #CCC;
}
.bottom-nav .btn-danger {
  background-color: #dc3545 !important;
  color: #fff !important;
  border: none !important;
}
.bottom-nav .info-wrapper {
  margin-bottom: 0.5rem;
}

.bottom-nav .infoText {
  margin: 0;
  font-size: 0.85rem;
  line-height: 1.4;
  color: #666;
}



@media (min-width:1141px){
    .wrapper{padding-left:644px;}
    .wrapper .side{
		position:fixed;
		top:0;
		left:calc(50% - 562px);
		bottom:0;
		width:540px;
	    align-items: baseline;
		display: flex;
		flex-direction: column;
		height: 100vh;
		justify-content: space-around;
		justify-items: center;
		flex-grow: 1;
	}
    .modal.modal-bottom .modal-dialog{left:644px;}
    #detail .detail-home{left:644px;}
    #form form .form-btn-wrap{left:644px;}
	#swiperOverlay {left:644px;}
	/* dialogModal fixed 중앙정렬 */
	.wrapper .page > main #dialogModal.modal {
		position: fixed !important;
		top: 50% !important;
		left: 50% !important;
		transform: translate(-50%, -50%) !important;
	}
	.bottom-nav{left:644px;}
}
@media (min-width:481px){
    .wrapper .page{border-right:1px solid #eee; border-left:1px solid #eee;}
}