/* common */
html, body {background:#FFFFFF;}
.btn-active {color:var(--color-white);}
.btn-gray-600 {color:var(--color-gray-400);}
.is-pc {display:block;}
.is-m {display:none;}
@media (max-width:991px){
.is-pc {display:none;}
.is-m {display:block;}
}
/* container */
:root{
--container-padding: 15px;
--container-padding-minus: -15px;
}
.container {max-width: calc(1200px + (var(--container-padding) * 2)); margin:0 auto; padding:0 var(--container-padding); width:100%;}
.container-xxl {max-width: calc(1400px + (var(--container-padding) * 2));}
.container-xl {max-width: calc(1200px + (var(--container-padding) * 2));}
.container-lg {max-width: calc(991px + (var(--container-padding) * 2));}
.container-md {max-width: calc(767px + (var(--container-padding) * 2));}
.container-sm {max-width: calc(575px + (var(--container-padding) * 2));}
.container-xs {max-width: calc(400px + (var(--container-padding) * 2));}
/* banner-box */
.banner-box {background-size:cover; background-position:center; margin:-100px 0 100px;}
.banner-box.review {background-image:url('../images/bg_sub_review.jpg');}
.banner-box.board {background-image:url('../images/bg_sub_board.png');}
.banner-box.maison {background-image:url('../images/bg_sub_board_maison.png');}
.banner-box h2 {padding:150px 0 110px; text-align:center; font-size:50px; text-align:center; color:var(--color-white); font-weight:600;}
@media (max-width:991px){
.banner-box {margin:-100px 0 50px;}
.banner-box h2 {padding:90px 0 50px; font-size:30px;}
}
/* title-box */
.title-box {margin:0 0 100px;}
.title-box h3 {text-align:center; font-size:45px; color:var(--color-active2); word-break:keep-all; font-weight:600;}
.title-box p {text-align:center; font-size:20px; color:var(--color-active2); word-break:keep-all; font-weight:500;}
@media (max-width:991px){
.title-box {margin:0 0 50px;}
.title-box h3 {font-size:25px;}
.title-box p {font-size:15px;}
}
/* score-box */
.score-box {display:flex; flex-wrap:wrap; align-items:center;}
.score-box p {font-size:14px; margin:0 8px 0 0;}
.score-box span {font-size:0; width:20px; height:20px; background:url('../images/icon_star.svg') no-repeat center / cover; filter:var(--filter-gray-500); margin:0 0 0 -2px;}
.score-box span.active {filter:invert(15%) sepia(91%) saturate(6170%) hue-rotate(358deg) brightness(106%) contrast(114%);;}
@media (max-width:991px){
.score-box span {width:16px; height:16px;}
.score-box p {margin:0 5px 0 0;}
}
/* user-box */
.user-box {display:flex; flex-wrap:wrap;}
.user-box > img {width:35px; height:35px; border-radius:50%; object-fit:cover;}
.user-box > div {flex:1; min-width:0; padding:0 0 0 10px;}
.user-box > div .info {display:flex; flex-wrap:wrap; align-items:center;}
.user-box > div .info b {font-size:14px; color:var(--color-gray-700);}
.user-box > div .info time {font-size:15px; margin:0 0 0 10px; color:var(--color-gray-700);}
/* gallery-list-box */
.gallery-list-box > ul {display:flex; flex-wrap:wrap; margin:0 -15px -60px;}
.gallery-list-box > ul > li {width:calc(33.33% - 30px); margin:0 15px 60px;}
.gallery-list-box > ul > li .inner {display:block;}
.gallery-list-box > ul > li .inner .list-image {position:relative; overflow:hidden;}
.gallery-list-box > ul > li .inner .list-image:after {display:block; content:""; padding-bottom:100%;}
.gallery-list-box > ul > li .inner .list-image img {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; transition:all ease 0.5s;}
.gallery-list-box > ul > li .inner .list-content {padding:20px 0 0;}
.gallery-list-box > ul > li .inner .list-content p {font-size:15px; line-height:1.8; color:var(--color-active2); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; text-overflow:ellipsis;}
.gallery-list-box > ul > li .inner .list-content b {display:block; margin:20px 0 0; font-size:15px; font-weight:700; color:var(--color-active2);}
.gallery-list-box > ul > li .inner:hover .list-image img {transform:scale(1.1);}
.gallery-list-box > ul > li .inner:hover .list-content p {text-decoration:underline;}
@media (max-width:991px){
.gallery-list-box > ul {margin:0 -5px -20px;}
.gallery-list-box > ul > li {width:calc(33.33% - 10px); margin:0 5px 20px;}
.gallery-list-box > ul > li .inner .list-content {padding:10px 0 0;}
.gallery-list-box > ul > li .inner .list-content p {font-size:14px;}
.gallery-list-box > ul > li .inner .list-content b {font-size:14px; margin:10px 0 0;}
}
@media (max-width:575px){
.gallery-list-box > ul {margin:0;}
.gallery-list-box > ul > li {width:100%; margin:0 0 100px;}
.gallery-list-box > ul > li:last-of-type {margin:0;}
.gallery-list-box > ul > li .inner .list-content b {text-align:right;}
}
/* review-list-box */
.review-list-box {overflow:hidden;}
.review-list-box > ul {display:flex; flex-wrap:wrap; margin:0 -2.5px -5px;}
.review-list-box > ul > li {width:calc(25% - 5px); margin:0 2.5px 5px;}
.review-list-box > ul > li .inner {position:relative; display:block;}
.review-list-box > ul > li .inner .list-image {position:relative; overflow:hidden;}
.review-list-box > ul > li .inner .list-image:after {display:block; content:""; padding-bottom:100%;}
.review-list-box > ul > li .inner .list-image img {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; transition:all ease 0.5s;}
.review-list-box > ul > li .inner .list-content {pointer-events:none; opacity:0; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); display:flex; flex-direction:column; transition:all ease 0.5s;}
.review-list-box > ul > li .inner .list-content .text {width:100%; height:100%; overflow-y:auto; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.review-list-box > ul > li .inner .list-content .text p {width:100%; font-size:15px; line-height:1.8; color:var(--color-white); text-align:center; padding:0 15px;}
.review-list-box > ul > li .inner .list-content .item {width:100%; display:flex; flex-wrap:wrap; align-items:center; padding:15px;}
.review-list-box > ul > li .inner .list-content .item > img {width:50px; height:50px;}
.review-list-box > ul > li .inner .list-content .item > div {flex:1; min-width:0; padding:0 0 0 10px;}
.review-list-box > ul > li .inner .list-content .item > div b {margin:0 0 3px; display:block; font-size:15px; font-weight:500; color:var(--color-white); font-family:"Montserrat", sans-serif overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.review-list-box > ul > li .inner:hover .list-image img {transform:scale(1.1);}
.review-list-box > ul > li .inner:hover .list-content {pointer-events:inherit; opacity:1;}
@media (max-width:991px){
.review-list-box > ul > li .inner .list-content {display:none;}
.review-list-box > ul > li .inner .list-content .text p {font-size:14px; line-height:1.5;}
.review-list-box > ul > li .inner .list-content .item {padding:10px;}
.review-list-box > ul > li .inner .list-content .item > img {width:40px; height:40px;}
.review-list-box > ul > li .inner .list-content .item > div {padding:0 0 0 7px;}
.review-list-box > ul > li .inner .list-content .item > div b {font-size:14px;}
}
@media (max-width:767px){
.review-list-box > ul {padding:0 15px;}
.review-list-box > ul > li {width:calc(50% - 5px);}
}
/* review-view-box */
.review-view-box {display:flex; flex-wrap:wrap; position:relative;}
.review-view-box .close {position:absolute; right:10px; top:10px; width:24px; height:24px; background:url('../images/icon_close.svg') no-repeat center / cover; font-size:0; filter:var(--filter-gray-600);}
.review-view-box .view-image {width:60%; background:#e5e7eb; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.review-view-box .view-image > img {display:block; margin:0 auto; max-width:100%; max-height:100%; object-fit:cover;}
.review-view-box .view-image .user-box {display:none;}
.review-view-box .view-content {width:40%; padding:20px;}
.review-view-box .view-content .view-text {border-top:1px solid var(--color-gray-400); padding:20px 0 0; margin:20px 0 0;}
.review-view-box .view-content .view-text img {display:none;}
.review-view-box .view-content .view-text p {font-size:15px; color:var(--color-gray-800);}
.review-view-box .view-content .view-item {margin:20px 0 0;}
.review-view-box .view-content .view-item .inner {display:flex; flex-wrap:wrap; align-items:center; border:1px solid var(--color-gray-400) !important;}
.review-view-box .view-content .view-item .inner > img {width:50px; height:50px; object-fit:cover; border-right:1px solid var(--color-gray-400);}
.review-view-box .view-content .view-item .inner > div {flex:1; min-width:0; padding:0 10px;}
.review-view-box .view-content .view-item .inner > div p {font-size:15px; color:var(--color-gray-700); font-weight:500; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.review-view-box .view-content .view-reply {margin:20px 0 0;}
.review-view-box .view-content .view-reply .reply-head {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:0 0 10px;}
.review-view-box .view-content .view-reply .reply-head p b {color:var(--color-active2); font-weight:500;}
.review-view-box .view-content .view-reply .reply-head .write {color:var(--color-active2); font-weight:500;}
.review-view-box .view-content .view-reply .reply-head .write:hover {text-decoration:underline;}
.review-view-box .view-content .view-reply .reply-body {border:1px solid var(--color-gray-400);}
.review-view-box .view-content .view-reply .reply-body textarea {width:100%; height:80px; padding:15px;}
.review-view-box .view-content .view-reply .reply-body > div {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:15px;}
.review-view-box .view-content .view-reply .reply-body > div label {position:relative; font-size:0; width:24px; height:24px; background:url('../images/icon_album.svg') no-repeat center / cover; filter:var(--filter-gray-800);}
.review-view-box .view-content .view-reply .reply-body > div label input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.review-view-box .view-content .view-reply .reply-body > div .submit {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; padding:5px 10px; font-size:13px; background:var(--color-active2); color:var(--color-white);}
@media (max-width:991px){
.review-view-box .view-image {display:none;}
.review-view-box .view-content {width:100%;}
.review-view-box .view-content .view-text img {display:block; margin:0 auto 10px; max-width:100%;}
}
/* modal-box */
.modal-box {pointer-events:none; opacity:0; position:fixed; left:0; top:0; width:100%; height:100%; transition:all ease 0.5s; z-index:99999; background:rgba(0,0,0,0.5);}
.modal-box .box {pointer-events:none; opacity:0; overflow:hidden; width:calc(100% - 30px); max-width:300px; max-height:90%; position:absolute; left:50%; top:45%; transform:translate(-50%,-50%); background:var(--color-white); transition:all ease 0.5s; border-radius:5px; display:flex; flex-direction:column;}
.modal-box .box .modal-head {padding:15px; width:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.modal-box .box .modal-head h2 {font-size:16px; font-weight:500;}
.modal-box .box .modal-head .close {width:20px; height:20px; font-size:0; background:url('../images/icon_close.svg') no-repeat center / cover; filter:var(--filter-gray-500);}
.modal-box .box .modal-body {width:100%; height:100%; padding:15px; overflow-y:auto;}
.modal-box .box .modal-body .modal-text p {text-align:center; font-size:16px; word-break:keep-all; color:var(--color-gray-800);}
.modal-box .box .modal-foot {margin:15px 0 0; width:100%; display:flex; flex-wrap:wrap; align-items:center; border-top:1px solid var(--color-gray-500);}
.modal-box .box .modal-foot a {height:45px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; flex:1; min-width:0; border-right:1px solid var(--color-gray-500); font-size:13px;}
.modal-box .box .modal-body a:last-of-type {border:0;}
.modal-box .box.review {max-width:900px;}
.modal-box .box.review .modal-body {padding:0;}
.modal-box.fixed {pointer-events:inherit; opacity:1;}
.modal-box.fixed .box {pointer-events:inherit; opacity:1; top:50%;}
@media (max-width:991px){
.modal-box .box .modal-body .modal-text p {font-size:14px;}
}
/* paging-box */
.paging-box {margin:24px 0 245px;}
.paging-box ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.paging-box ul li {margin:0 5px 0 0;}
.paging-box ul li:last-of-type {margin:0;}
.paging-box ul li * {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; width:32px; height:32px; font-size:14px; font-weight:600; color:var(--color-gray-800);}
.paging-box ul li a:hover {color:var(--color-active); text-decoration:underline;}
.paging-box ul li p {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; width:32px; height:32px; font-size:14px; font-weight:600; color:var(--color-gray-800);}
.paging-box ul li.active a {border-radius:50%; background:var(--color-active); color:var(--color-white);}
.paging-box ul li.pg * {font-size:0;}
.paging-box ul li.pg *:after {display:block; content:""; width:24px; height:24px; background-size:cover; background-position:center; background-repeat:no-repeat; filter:var(--filter-gray-800);}
.paging-box ul li.pg.prev {margin:0 10px 0 0;}
.paging-box ul li.pg.prev *:after {background-image:url('../images/icon_arrow_left.svg');}
.paging-box ul li.pg.next {margin:0 0 0 10px;}
.paging-box ul li.pg.next *:after {background-image:url('../images/icon_arrow_right.svg');}
.paging-box ul li.pg.first *:after {background-image:url('../images/icon_arrow_left_double.svg');}
.paging-box ul li.pg.last *:after {background-image:url('../images/icon_arrow_right_double.svg');}
.paging-box ul li.disabled {background:none !important;}
.paging-box ul li.disabled.pg *:after {filter:var(--filter-gray-500);}
.paging-box.paging-left ul {justify-content:flex-start;}
.paging-box.paging-right ul {justify-content:flex-end;}
@media (max-width:991px){
.paging-box {margin:24px 0 100px;}
.paging-box ul li a {width:25px; height:25px; font-size:13px;}
.paging-box ul li p {width:25px; height:25px; font-size:13px;}
.paging-box ul li.pg *:after {width:20px; height:20px;}
}
.hclass { height:200px; }
.hclass2 { margin-top:-60px;}
@media (max-width:991px){
.hclass { height:50px;}
.hclass2 { margin-top:-30px;}
}
/* board-list-box */
.board-list-box {border-top:1px solid #000000;}
.board-list-box table {table-layout:fixed;}
.board-list-box table thead tr th {font-size:15px; font-weight:500; padding:10px; border-width:0 1px 1px 0; border-bottom:1px solid #000000;}
.board-list-box table thead tr th:last-of-type {border-right:0;}
.board-list-box table tbody tr td {font-size:15px; padding:10px; border:1px solid var(--color-gray-700); border-width:0 0 1px 0;}
.board-list-box table tbody tr td:last-of-type {border-right:0;}
.board-list-box table tbody tr td .subject {display:flex; align-items:center;}
.board-list-box table tbody tr td .subject .subject-tit {font-size:15px; line-height:1; display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-weight:400;}
.board-list-box table tbody tr td .subject .subject-cnt {font-size:15px; font-weight:500; margin:0 0 0 5px; color:var(--color-active); flex-shrink:0;}
.board-list-box table tbody tr td .subject .icon {flex-shrink:0;}
.board-list-box table tbody tr td .badge-box {font-size:16px;}
.board-list-box table tbody tr:hover td .subject .subject-tit {text-decoration:underline;}
.board-list-box table tbody tr.notice td {background:#FFFFFF; border-color:var(--color-gray-700);}
@media (max-width:991px){
.board-list-box table colgroup {display:none;}
.board-list-box table thead {display:none;}
.board-list-box table tbody {display:block;}
.board-list-box table tbody tr {padding:15px 10px; display:flex; flex-wrap:wrap; align-items:center; border-bottom:1px solid #000000;}
.board-list-box table tbody tr td {padding:0; border:0; color:var(--color-gray-800);}
.board-list-box table tbody tr td.subject-cell {width:100%; margin:0 0 5px;}
.board-list-box table tbody tr td.subject-cell .subject-tit {color:var(--color-black); font-weight:400;}
.board-list-box table tbody tr td.mo-line {display:flex; flex-wrap:wrap; align-items:center;}
.board-list-box table tbody tr td.mo-line:after {display:inline-block; content:""; width:1px; height:10px; background:var(--color-gray-700); margin:0 10px;}
.board-list-box table tbody tr td.mo-hidden {display:none;}
.board-list-box table tbody tr td .badge-box {font-size:14px;}
.board-list-box table tbody tr.notice {background:#FFFFFF;}
.board-list-box table tbody tr.notice td.mo-line:after {background:var(--color-gray-700);}
}
@media (max-width:767px){
.board-list-box table tbody tr td {font-size:13px;}
.board-list-box table tbody tr td .badge-box {font-size:13px;}
}
/* board-view-box */
.board-view-box {border-top:1px solid var(--color-active);}
.board-view-box .view-head {border-bottom:1px solid var(--color-gray-700); padding:15px;}
.board-view-box .view-head .head-subject {display:flex; flex-wrap:wrap;}
.board-view-box .view-head .head-subject .badge-box {font-size:20px; margin:0 10px 0 0;}
.board-view-box .view-head .head-subject h2 {font-size:20px; font-weight:600; flex:1; min-width:0;}
.board-view-box .view-head .head-info {margin:10px 0 0;}
.board-view-box .view-head .head-info ul {display:flex; flex-wrap:wrap; align-items:center;}
.board-view-box .view-head .head-info ul li {display:flex; flex-wrap:wrap; align-items:center; font-size:15px; color:var(--color-gray-900);}
.board-view-box .view-head .head-info ul li:after {display:inline-block; content:""; width:1px; height:13px; margin:0 10px; background:var(--color-gray-600);}
.board-view-box .view-head .head-info ul li:last-of-type:after {display:none;}
.board-view-box .view-body .view-body-content {border-bottom:0px solid var(--color-gray-700); padding:40px 15px;}
.board-view-box .view-body .view-body-content p {font-size:16px; margin:0 0 5px; color:var(--color-gray-900);}
.board-view-box .view-body .view-body-content p:last-of-type {margin:0;}
.board-view-box .view-body .view-body-content img {display:block; margin:0 auto; max-width:100%;}
.board-view-box .view-body .view-body-file {padding:15px;}
.board-view-box .view-body .view-body-list {margin:15px 0 0;}
.board-view-box .view-body .view-body-list > ul {border-top:1px solid var(--color-black);}
.board-view-box .view-body .view-body-list > ul > li {border-bottom:1px solid var(--color-gray-700);}
.board-view-box .view-body .view-body-list > ul > li .more {display:flex; align-items:center; padding:15px;}
.board-view-box .view-body .view-body-list > ul > li .more b {font-size:16px; border-radius:50px; width:100px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:40px; background:var(--color-active); color:var(--color-white);}
.board-view-box .view-body .view-body-list > ul > li .more b:after {display:block; content:""; width:20px; height:20px; margin:0 0 0 5px; filter:var(--filter-white); background-size:cover; background-position:center;}
.board-view-box .view-body .view-body-list > ul > li .more p {flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:16px; padding:0 15px;}
.board-view-box .view-body .view-body-list > ul > li .more time {font-size:15px; color:var(--color-gray-700);}
.board-view-box .view-body .view-body-list > ul > li .more:hover p {text-decoration:underline;}
.board-view-box .view-body .view-body-list > ul > li.prev .more b:after {background-image:url('../images/icon_arrow_up.svg');}
.board-view-box .view-body .view-body-list > ul > li.next .more b:after {background-image:url('../images/icon_arrow_down.svg');}
@media (max-width:991px){
.board-view-box .view-head {padding:15px 10px;}
.board-view-box .view-head .head-subject .badge-box {font-size:18px; margin:0 5px 0 0;}
.board-view-box .view-head .head-subject h2 {font-size:18px;}
.board-view-box .view-head .head-info ul li {font-size:13px;}
.board-view-box .view-head .head-info ul li:after {height:10px; margin:0 7px;}
.board-view-box .view-body .view-body-content {padding:15px 10px;}
.board-view-box .view-body .view-body-content p {font-size:14px;}
.board-view-box .view-body .view-body-file {padding:15px 10px;}
.board-view-box .view-body .view-body-list > ul > li .more {padding:10px;}
.board-view-box .view-body .view-body-list > ul > li .more b {font-size:13px; width:70px; height:32px;}
.board-view-box .view-body .view-body-list > ul > li .more b:after {width:16px; height:16px; margin:0 0 0 2px;}
.board-view-box .view-body .view-body-list > ul > li .more p {font-size:15px; padding:0 10px;}
.board-view-box .view-body .view-body-list > ul > li .more time {font-size:13px;}
}
/* file-list-box */
.file-list-box > ul > li {margin:0 0 5px;}
.file-list-box > ul > li:last-of-type {margin:0;}
.file-list-box > ul > li .list-inner {padding:10px 15px; border-radius:5px; display:flex; align-items:center; border:1px solid var(--color-gray-700);}
.file-list-box > ul > li .list-inner:before {display:inline-block; content:""; width:20px; height:20px; margin:0 5px 0 0; flex-shrink:0; background:url('../images/icon_clip.svg') no-repeat center / cover;}
.file-list-box > ul > li .list-inner p {font-size:16px; text-decoration:underline; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; flex:1; min-width:0;}
.file-list-box > ul > li .list-inner .download {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; margin:0 0 0 15px; flex-shrink:0;}
.file-list-box > ul > li .list-inner .download:after {display:block; content:""; width:16px; height:16px; margin:0 0 0 5px; background:url('../images/icon_download.svg') no-repeat center / cover;}
.file-list-box > ul > li .list-inner .download:hover {text-decoration:underline;}
.file-list-box > ul > li .list-inner .preview {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; margin:0 0 0 15px; flex-shrink:0;}
.file-list-box > ul > li .list-inner .preview:after {display:block; content:""; width:16px; height:16px; margin:0 0 0 5px; background:url('../images/icon_scan.svg') no-repeat center / cover;}
.file-list-box > ul > li .list-inner .preview:hover {text-decoration:underline;}
.file-list-box > ul > li .list-inner:hover {background:#c9d6c4;}
@media (max-width:991px){
.file-list-box > ul > li .list-inner {padding:10px;}
.file-list-box > ul > li .list-inner:before {width:16px; height:16px;}
.file-list-box > ul > li .list-inner p {font-size:14px;}
.file-list-box > ul > li .list-inner .download {font-size:13px; margin:0 0 0 10px;}
.file-list-box > ul > li .list-inner .download:after {width:14px; height:14px;}
.file-list-box > ul > li .list-inner .preview {font-size:13px; margin:0 0 0 10px;}
.file-list-box > ul > li .list-inner .preview:after {width:14px; height:14px;}
}
/* category-box */
.category-box {margin:50px 0 100px;}
.category-box ul {gap:10px 15px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.category-box ul li a {font-size:15px; color:var(--color-active2); font-weight:500; border-bottom:1px solid transparent;}
.category-box ul li.active a {border-color:var(--color-light-active); color:var(--color-light-active);}
@media (max-width:991px){
.category-box {margin:25px 0 50px;}
.category-box ul li a {font-size:14px;}
}
/* item-list-box */
.item-list-box > ul {display:flex; flex-wrap:wrap; margin:0 -15px -50px;}
.item-list-box > ul > li {width:calc(25% - 30px); margin:0 15px 50px;}
.item-list-box > ul > li .inner {display:block;}
.item-list-box > ul > li .inner .list-image {position:relative; overflow:hidden;}
.item-list-box > ul > li .inner .list-image:after {display:block; content:""; padding-bottom:100%;}
.item-list-box > ul > li .inner .list-image img {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; transition:all ease 0.5s;}
.item-list-box > ul > li .inner .list-image img.hover {opacity:0;}
.item-list-box > ul > li .inner .list-content {padding:15px 0 0;}
.item-list-box > ul > li .inner .list-content strong {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:16px; font-weight:500;}
.item-list-box > ul > li .inner .list-content > .price {display:flex; flex-wrap:wrap; align-items:baseline; justify-content:flex-start;}
.item-list-box > ul > li .inner .list-content > .price b {font-size:15px; font-weight:500;}
.item-list-box > ul > li .inner .list-content > .price strike {font-size:13px; margin:0 0 0 5px; color:var(--color-gray-700);}
.item-list-box > ul > li .inner .list-content .sale {display:flex; flex-wrap:wrap; align-items:center; margin:8px 0 0;}
.item-list-box > ul > li .inner .list-content .sale b {display:flex; flex-wrap:wrap; align-items:center; border:1px solid #77875F; border-radius:50px; padding:0 15px; color:#77875F; font-weight:600;}
.item-list-box > ul > li .inner:hover .list-image img {transform:scale(1.1);}
.item-list-box > ul > li .inner:hover .list-image img.hover {opacity:1; z-index:2;}
.item-list-box > ul > li .inner:hover .list-content strong {text-decoration:underline;}
.item-list-box.swiper-container {overflow:hidden;}
.item-list-box.swiper-container > ul {flex-wrap:inherit; margin:0;}
.item-list-box.swiper-container > ul > li {width:auto; margin:0;}
@media (max-width:991px){
.item-list-box > ul {margin:0 -5px -30px;}
.item-list-box > ul > li {width:calc(25% - 10px); margin:0 5px 30px;}
.item-list-box > ul > li .inner .list-content {padding:10px 0 0;}
.item-list-box > ul > li .inner .list-content strong {font-size:15px;}
.item-list-box > ul > li .inner .list-content > .price b {font-size:14px;}
.item-list-box > ul > li .inner .list-content .sale b {font-size:13px;}
}
@media (max-width:767px){
.item-list-box > ul > li {width:calc(33.33% - 10px);}
.item-list-box.swiper-container > ul > li {width:auto;}
}
@media (max-width:575px){
.item-list-box > ul > li {width:calc(50% - 10px);}
.item-list-box.swiper-container > ul > li {width:auto;}
}
/* item-banner-box */
.item-banner-box {margin:200px 0 100px;}
.item-banner-box span {display:block;}
.item-banner-box span img {width:100%;}
/* item-banner-box */
.item-banner-box2 {margin:100px 0 0;}
.item-banner-box2 span {display:block;}
.item-banner-box2 span img {width:100%;}
@media (max-width:991px){
.item-banner-box {margin:100px 0 -50px;}
.item-banner-box2 {margin:50px 0 -50px;}
}
@media (max-width:991px){
.item-banner-box {margin:100px 0 -50px;}
}
/* button-box */
.button-box {display:flex; flex-wrap:wrap; align-items:center;}
.button-box .btn {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:40px; padding:0 20px;}
.button-box .btn-black {color:var(--color-white);}
.button-box .btn-border {border:1px solid var(--color-gray-600);}
.button-box .btn-beige {background:#dfd4c1; border:1px solid var(--color-gray-500); color:var(--color-black-300) !important;}
/* item-view-box */
.item-view-box .view-title {margin:0 0 30px;}
.item-view-box .view-title h3 {font-size:20px; font-weight:600; color:var(--color-active2);}
.item-view-box .view-title p {font-size:15px; color:var(--color-gray-800); word-break:keep-all; margin:5px 0 10px;}
.item-view-box .view-thumb {display:block; max-width:750px; margin:0 auto 80px;}
.item-view-box .view-thumb .inner {position:relative; overflow:hidden;}
.item-view-box .view-thumb .inner:after {display:block; content:""; padding-bottom:100%;}
.item-view-box .view-thumb .inner img {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;}
.item-view-box .view-thumb ul {margin:10px 0 0; display:block; overflow-x:auto; white-space:nowrap; font-size:0; text-align:center;}
.item-view-box .view-thumb ul li {width:70px; display:inline-block; font-size:0; margin:0 1px 0 0; position:relative; border:1px solid transparent; transition:all ease 0.5s;}
.item-view-box .view-thumb ul li:last-of-type {margin:0;}
.item-view-box .view-thumb ul li:after {display:block; content:""; padding-bottom:100%;}
.item-view-box .view-thumb ul li img {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;}
.item-view-box .view-thumb ul li.active {border-color:var(--color-active2);}
.item-view-box .view-content .category {margin:0 0 10px;}
.item-view-box .view-content .category ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.item-view-box .view-content .category ul li {display:flex; flex-wrap:wrap; align-items:center;}
.item-view-box .view-content .category ul li:after {display:inline-block; content:""; width:24px; height:24px; margin:0 10px; background:url('../images/icon_arrow_right.svg') no-repeat center / cover; filter:var(--filter-gray-500);}
.item-view-box .view-content .category ul li:last-of-type:after {display:none;}
.item-view-box .view-content .category ul li a {font-size:16px; color:var(--color-gray-700); color:var(--color-black-300);}
.item-view-box .view-content .category ul li a:hover {text-decoration:underline;}
.item-view-box .view-content .subject {margin:0 0 5px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.item-view-box .view-content .subject h2 {font-size:24px; font-weight:500; color:var(--color-active2);}
.item-view-box .view-content .subject b {display:flex; flex-wrap:wrap; align-items:center; margin:0 0 0 10px; border:1px solid #f00; border-radius:50px; color:#f00; padding:0 10px; font-weight:500;}
.item-view-box .view-content .price {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.item-view-box .view-content .price b {font-size:20px; color:var(--color-active2);}
.item-view-box .view-content .price strike {margin:0 0 0 5px; color:var(--color-gray-700); font-size:16px;}
.item-view-box .view-content .text {margin:50px 0 0;}
.item-view-box .view-content .text p {text-align:center; color:var(--color-active2); font-size:16px; line-height:1.8; word-break:keep-all;}
.item-view-box .view-content .tab {position:sticky; top:0; z-index:100; margin:100px 0 50px; background:#FFFFFF;}
.item-view-box .view-content .tab ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.item-view-box .view-content .tab ul li {flex:1; min-width:0; border-bottom:1px solid var(--color-gray-600);}
.item-view-box .view-content .tab ul li button {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; width:100%; padding:15px 10px; font-size:16px; color:#000000;}
.item-view-box .view-content .tab ul li button b {margin:0 0 0 5px; font-size:16px; font-weight:500; color:var(--color-active2);}
.item-view-box .view-content .tab ul li:hover {border-color:var(--color-active2);}
.item-view-box .view-content .tab ul li:hover button {color:var(--color-active2); font-weight:600;}
.item-view-box .view-content .tab ul li.active {border-color:var(--color-active2);}
.item-view-box .view-content .tab ul li.active button {color:var(--color-active2); font-weight:600;}
.item-view-box .view-content .detail img {display:block; margin:0 auto 50px; max-width:100%;}
.item-view-box .view-content .detail p {font-size:16px; color:var(--color-active2); line-height:1.8; word-break:keep-all; margin:0 0 50px;}
.item-view-box .view-content .detail p:last-of-type {margin:0;}
.item-view-box .view-content .detail p b {font-size:16px; color:var(--color-active2); line-height:1.8; font-weight:600; word-break:keep-all;}
.item-view-box .view-content .detail2 img {display:block; margin:0 auto 50px; max-width:100%;}
.item-view-box .view-content .detail2 p {font-size:16px; color:var(--color-active2); line-height:0.2; word-break:keep-all; margin:0 0 30px;}
.item-view-box .view-content .detail2 p:last-of-type {margin:0;}
.item-view-box .view-content .detail2 p b {font-size:16px; color:var(--color-active2); line-height:0.2; font-weight:600; word-break:keep-all;}
.item-view-box .view-content .review {margin:200px 0 0;}
.item-view-box .view-content .review .review-head {display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; margin:0 0 15px; padding:0 0 15px; border-bottom:1px solid #333;}
.item-view-box .view-content .review .review-head .photo {padding:0 0 5px; display:flex; flex-wrap:wrap; align-items:center; font-size:15px; color:var(--color-black-500);}
.item-view-box .view-content .review .review-head .photo:before {display:inline-block; content:""; width:20px; height:20px; background:url('../images/icon_album.svg') no-repeat center / cover; filter:var(--filter-black-500); margin:0 5px 0 0;}
.item-view-box .view-content .review .review-body > ul > li {position:relative; border-bottom:1px solid var(--color-gray-500); padding:0 0 20px; margin:0 0 20px;}
.item-view-box .view-content .review .review-body > ul > li .more {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0;}
.item-view-box .view-content .review .review-body > ul > li .inner {display:flex; flex-wrap:wrap;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-left {flex:1; min-width:0; padding:0 20px 0 0;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-left p {margin:10px 0;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-left img {width:80px; height:80px; object-fit:cover;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-right b {display:block; color:var(--color-gray-800);}
.item-view-box .view-content .review .review-body > ul > li .inner .list-right time {display:block; color:var(--color-gray-800);}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom {display:none; width:100%; margin:20px 0 0;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom > strong {display:flex; flex-wrap:wrap; align-items:center; margin:0 0 10px; font-size:16px;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom > strong b {font-size:16px; font-weight:600; color:var(--color-active2); margin:0 0 0 5px;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom .bottom-inner {border:1px solid var(--color-gray-600); position:relative; z-index:3;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom .bottom-inner textarea {background:none; width:100%; height:80px; padding:15px;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom .bottom-inner > div {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:15px;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom .bottom-inner > div label {position:relative; font-size:0; width:24px; height:24px; background:url('../images/icon_album.svg') no-repeat center / cover; filter:var(--filter-gray-800);}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom .bottom-inner > div label input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom .bottom-inner > div .submit {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; padding:5px 10px; font-size:13px; background:var(--color-active2); color:var(--color-white);}
.item-view-box .view-content .review .review-body > ul > li .inner:hover .list-left p {text-decoration:underline;}
.item-view-box .view-content .review .review-body > ul > li.active .inner .list-left img {width:100%; max-width:500px; height:auto;}
.item-view-box .view-content .review .review-body > ul > li.active .inner .list-bottom {display:block;}
.item-view-box .view-content .qna {margin:200px 0 0;}
.item-view-box .view-content .related {margin:200px 0 0;}
@media (max-width:991px){
.item-view-box {margin:-20px 0 0;}
.item-view-box .view-title {margin:0 0 20px;}
.item-view-box .view-title h3 {font-size:18px;}
.item-view-box .view-title p {font-size:14px;}
.item-view-box .view-thumb {margin:0 0 50px;}
.item-view-box .view-thumb .inner {margin:0 -15px;}
.item-view-box .view-thumb ul li {width:60px;}
.item-view-box .view-content .category ul li:after {width:20px; height:20px; margin:0 5px;}
.item-view-box .view-content .category ul li a {font-size:14px;}
.item-view-box .view-content .subject h2 {font-size:20px;}
.item-view-box .view-content .subject b {font-size:13px;}
.item-view-box .view-content .price b {font-size:18px;}
.item-view-box .view-content .price strike {font-size:15px;}
.item-view-box .view-content .text {margin:30px 0 0;}
.item-view-box .view-content .text p {font-size:14px;}
.item-view-box .view-content .tab {margin:50px -15px;}
.item-view-box .view-content .tab ul li button {font-size:15px;}
.item-view-box .view-content .tab ul li button b {font-size:15px;}
.item-view-box .view-content .detail img {margin:0 auto 30px;}
.item-view-box .view-content .detail p {margin:0 0 30px; font-size:14px;}
.item-view-box .view-content .detail p b {font-size:14px;}
.item-view-box .view-content .review {margin:100px 0 0;}
.item-view-box .view-content .review .review-head .photo {font-size:14px;}
.item-view-box .view-content .review .review-head .photo:before {width:16px; height:16px;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-left {flex:none; width:100%; padding:0; order:1;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-right {width:100%; order:3; margin:15px 0 0;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-right time {margin:-3px 0 0;}
.item-view-box .view-content .review .review-body > ul > li .inner .list-bottom {width:100%; order:2; margin:15px 0 0;}
.item-view-box .view-content .qna {margin:100px 0 0;}
.item-view-box .view-content .related {margin:100px 0 0;}
}
.dropdown-box {width:200px; position:relative;}
.dropdown-box button {width:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; height:40px; padding:0 20px; border:1px solid var(--color-gray-700); border-radius:5px; overflow:hidden;}
.dropdown-box button:after {display:inline-block; content:""; width:20px; height:20px; background:url('../images/icon_arrow_down.svg') no-repeat center / cover; filter:var(--filter-gray-700); margin:0 0 0 10px;}
.dropdown-box button .score-box {display:flex; flex-wrap:wrap; align-items:center; flex:1; min-width:0;}
.dropdown-box button .score-box p {color:#000;}
.dropdown-box button .score-box span {width:16px; height:16px;}
.dropdown-box .dropdown-inner {width:100%; position:absolute; left:0; top:calc(100% + 10px); background:#eae1d2; border-radius:5px; border:1px solid var(--color-gray-700); padding:10px 0;}
.dropdown-box .dropdown-inner ul li .more {padding:5px 15px;}
.dropdown-box.active {z-index:100;}
@media (max-width:991px){
.dropdown-box {width:180px;}
}
/* badge-box */
.badge-box {gap:2px; display:flex; flex-wrap:wrap; align-items:center;}
.badge-box .badge {font-size:0.75em; padding:0.25em 0.45em; border-radius:0.375rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
/* list-none-box */
.list-none-box {border-top:1px solid var(--color-active2); border-bottom:1px solid var(--color-gray-700); padding:100px 15px;}
.list-none-box p {text-align:center; font-size:18px; font-weight:500; color:var(--color-gray-800);}
@media (max-width:991px){
.list-none-box {padding:50px 15px;}
.list-none-box p {font-size:16px;}
}
/* like-button-box */
.like-button-box > * {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; font-weight:500; color:#333;}
.like-button-box > *:before {display:inline-block; content:""; width:20px; height:20px; margin:0 5px 0 0; background:url('../images/icon_heart.svg') no-repeat center / cover;}
.like-button-box > *.active:before {background-image:url('../images/icon_heart_on.svg'); filter:var(--filter-active-200);}
/* share-button-box */
.share-button-box > * {display:block; font-size:0; width:20px; height:20px; background:url('../images/icon_share.svg') no-repeat center / cover;}
/* cart-button-box */
.cart-button-box > * {display:flex; flex-wrap:wrap; align-items:center; font-size:0;}
.cart-button-box > *:before {display:block; content:""; width:20px; height:20px; margin:0 5px 0 0; background:url('../images/icon_cart.svg') no-repeat center / cover;}
/* bottom-box */
.bottom-box {position:sticky; bottom:0; width:100%; z-index:100; background:#FFFFFF; margin:100px 0 -100px;}
.bottom-box .bottom-fixed {border-top:1px solid var(--color-gray-500);}
.bottom-box .bottom-fixed .container {display:flex; flex-wrap:wrap; align-items:center; padding:15px;}
.bottom-box .bottom-fixed .bottom-left {display:flex; flex-wrap:wrap; align-items:center;}
.bottom-box .bottom-fixed .bottom-right {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end;}
.bottom-box .bottom-fixed .bottom-right p {font-size:15px; color:var(--color-gray-700); margin:0 10px 0 0;}
.bottom-box .bottom-fixed .bottom-right b {font-size:18px; color:var(--color-active2); margin:0 20px 0 0; font-weight:600;}
.bottom-box .bottom-fixed .bottom-right .btn {padding:0 40px; height:50px; font-size:16px; font-weight:500; color:var(--color-white);}
.bottom-box .bottom-fixed .bottom-right .btn-beige {display:none;}
.bottom-box .bottom-content {box-shadow:0 -5px 10px rgba(0,0,0,0.05); padding:20px 0 50px; position:relative; display:none;}
.bottom-box .bottom-content .close {border-radius:5px 5px 0 0; box-shadow:0 -5px 10px rgba(0,0,0,0.05); position:absolute; left:50%; bottom:100%; transform:translateX(-50%); width:100px; height:30px; background:#eae1d2 url('../images/icon_arrow_down.svg') no-repeat center / 24px; font-size:0;}
.bottom-box .bottom-content .container {display:flex; flex-wrap:wrap;}
.bottom-box .bottom-content .container > div {flex:1; min-width:0; margin:0 30px 0 0;}
.bottom-box .bottom-content .container > div:last-of-type {margin:0;}
.bottom-box .bottom-content .bottom-left ul li {margin:0 0 10px; display:flex; flex-wrap:wrap;}
.bottom-box .bottom-content .bottom-left ul li:last-of-type {margin:0;}
.bottom-box .bottom-content .bottom-left ul li h3 {width:80px; font-size:15px; font-weight:500;}
.bottom-box .bottom-content .bottom-left ul li p {flex:1; min-width:0; font-size:15px; word-break:keep-all;}
.bottom-box .bottom-content .bottom-right > .inner {background:rgba(54,54,54,0.03); padding:15px;}
.bottom-box .bottom-content .bottom-right > .inner h3 {font-size:15px; font-weight:500; border-bottom:1px dashed var(--color-gray-500); padding:0 0 15px; margin:0 0 15px;}
.bottom-box.active .bottom-content {display:block;}
@media (max-width:991px){
.bottom-box .bottom-fixed .bottom-left {display:none;}
.bottom-box .bottom-fixed .bottom-right p {display:none;}
.bottom-box .bottom-fixed .bottom-right b {display:none;}
.bottom-box .bottom-fixed .bottom-right .button-box {width:100%;}
.bottom-box .bottom-fixed .bottom-right .btn {flex:1; min-width:0; margin:0 8px 0 0;}
.bottom-box .bottom-fixed .bottom-right .btn:last-of-type {margin:0;}
.bottom-box .bottom-fixed .bottom-right .btn-beige {display:flex;}
.bottom-box .bottom-content .container > div {margin:0;}
.bottom-box .bottom-content .bottom-left {width:100%; flex:none !important;}
.bottom-box .bottom-content .bottom-left ul li h3 {width:60px; font-size:13px;}
.bottom-box .bottom-content .bottom-left ul li p {font-size:13px;}
.bottom-box .bottom-content .bottom-right {width:100%; flex:none !important; margin:20px 0 0 !important;}
.bottom-box .bottom-content .bottom-right > .inner h3 {font-size:13px;}
}
/* total-box */
.total-box {margin:30px 0 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.total-box p {font-size:16px; color:var(--color-gray-800);}
.total-box b {font-size:20px; font-weight:500; color:var(--color-active2);}
@media (max-width:991px){
.total-box {margin:20px 0 0;}
.total-box p {font-size:15px;}
.total-box b {font-size:18px;}
}
/* quantity-box */
.quantity-box {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.quantity-box .inner {width:130px; border:1px solid var(--color-gray-400); border-radius:4px; display:flex; flex-wrap:wrap; align-items:center; background:var(--color-white);}
.quantity-box .inner .quantity-btn {width:35px; height:35px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; font-size:0;}
.quantity-box .inner .quantity-btn:after {display:block; content:""; width:16px; height:16px; background-size:cover; background-position:center;}
.quantity-box .inner .quantity-btn.minus {border-radius:4px 0 0 4px;}
.quantity-box .inner .quantity-btn.minus:after {background-image:url('../images/icon_minus.svg');}
.quantity-box .inner .quantity-btn.plus {border-radius:0 4px 4px 0;}
.quantity-box .inner .quantity-btn.plus:after {background-image:url('../images/icon_plus.svg');}
.quantity-box .inner .quantity-btn.disabled {background-color:var(--color-disabled) !important;}
.quantity-box .inner input {height:35px; text-align:center; flex:1; min-width:0; border-radius:0; border:1px solid var(--color-gray-400); border-width:0 1px;}
.quantity-box > strong {font-size:18px; font-weight:500; color:var(--color-gray-800);}
@media (max-width:991px){
.quantity-box .quantity-btn.minus {background-size:16px !important;}
.quantity-box .quantity-btn.plus {background-size:16px !important;}
}
/* share-box */
.share-box > ul {display:flex; flex-wrap:wrap; margin:0 -5px -15px;}
.share-box > ul li {width:calc(25% - 10px); margin:0 5px 15px;}
.share-box > ul li .inner {display:block;}
.share-box > ul li .inner img {width:100%;}
.share-box > ul li .inner p {text-align:center; font-size:13px;}
.share-box > div {display:flex; flex-wrap:wrap; align-items:center; border:1px solid var(--color-gray-400); margin:15px 0 0;}
.share-box > div input {flex:1; min-width:0; padding:0 10px; background:#efefef; height:35px;}
.share-box > div .copy {display:flex; flex-wrap:wrap; align-items:center; padding:0 12px; font-size:13px; border-left:1px solid var(--color-gray-400); height:35px;}
/*main 이미지 위 아래로*/
.float {animation: floating 3s ease-in-out infinite;}
@keyframes floating { 0% { transform: translateY(0); } 50% { transform: translateY(-30px); } 100% { transform: translateY(0); }}
/* 기본 레이아웃 */
.ma-section {
display: flex;
gap: 10px;
margin: 40px 0;
}
.ma-section .ma-col {
flex: 1;
width: 50%;
padding: 10px;
}
.ma-section .ma-col img {
width: 100%;
height: auto;
display: block;
}
/* 초기 상태 */
.ma-section .ma-col {
opacity: 0;
}
/* 왼쪽 → 오른쪽 (첫 섹션) */
.ma-section.ma-left.animate .left { animation: maSlideLeft 0.7s ease-out forwards; }
.ma-section.ma-left.animate .right { animation: maSlideLeftDelay 0.7s ease-out forwards; animation-delay: .15s; }
/* 오른쪽 → 왼쪽 (두 번째 섹션) */
.ma-section.ma-right.animate .right { animation: maSlideRight 0.7s ease-out forwards; }
.ma-section.ma-right.animate .left { animation: maSlideRightDelay 0.7s ease-out forwards; animation-delay: .15s; }
/* keyframes */
@keyframes maSlideLeft {
from { transform: translateX(-80px); opacity: 0; }
to { transform: translateX(0); opacity: 1; }
}
@keyframes maSlideLeftDelay {
from { transform: translateX(-50px); opacity: 0; }
to { transform: translateX(0); opacity: 1; }
}
@keyframes maSlideRight {
from { transform: translateX(80px); opacity: 0; }
to { transform: translateX(0); opacity: 1; }
}
@keyframes maSlideRightDelay {
from { transform: translateX(50px); opacity: 0; }
to { transform: translateX(0); opacity: 1; }
}
/* 모바일: 세로로 쌓고 fade-up */
@media (max-width: 768px){
.ma-section { flex-direction: column; }
.ma-section .ma-col { width: 100%; }
.ma-section.animate .ma-col {
animation: maFadeUp .45s ease-out forwards;
}
}
@keyframes maFadeUp {
from { transform: translateY(40px); opacity: 0; }
to { transform: translateY(0); opacity: 1; }
}