@import url('./page.css');

section.top-banner {background-image: -webkit-image-set(url('../images/yozum-pick-banner.png') 1x, url('../images/yozum-pick-banner@2x.png') 2x);
    background-image: image-set(url('../images/yozum-pick-banner.png') 1x, url('../images/yozum-pick-banner@2x.png') 2x);}
@media (max-width:734px) {
    section.top-banner {background-image: -webkit-image-set(url('../images/yozum-pick-banner-s.png') 1x, url('../images/yozum-pick-banner-s@2x.png') 2x);
        background-image: image-set(url('../images/yozum-pick-banner-s.png') 1x, url('../images/yozum-pick-banner-s@2x.png') 2x);}
    section.top-banner .box-title .tit .small span {font-size: 16px;}
    section.top-banner .box-title .tit .tit-inner.small span {padding-bottom: 13px;}
    section.top-banner .box-title .tit span.info {font-size: 13px;}
}

section.more-content {background-image: -webkit-image-set(url('../images/culture-museum-banner.png') 1x, url('../images/culture-museum-banner@2x.png') 2x);
    background-image: image-set(url('../images/culture-museum-banner.png') 1x, url('../images/culture-museum-banner@2x.png') 2x);}
@media (max-width:734px) {
    section.more-content {background-image: -webkit-image-set(url('../images/culture-museum-banner-s.png') 1x, url('../images/culture-museum-banner-s@2x.png') 2x);
        background-image: image-set(url('../images/culture-museum-banner-s.png') 1x, url('../images/culture-museum-banner-s@2x.png') 2x);}
}

.wrap-content section {margin:56px 0;}
.wrap-content section.bg-section {padding:48px;}
.wrap-content section .section-item {margin:64px 0;}
.wrap-content section h3 {margin-bottom: 16px;}

@media (max-width:1100px) {
    .box-img.small {width:50%;max-width: 300px;}
}

@media (max-width:734px) {
    .wrap-content section {margin:24px 0;}
    .wrap-content section.bg-section {padding:10px;}
    .wrap-content section .section-item {margin:24px 0;}
    .wrap-content section h3 {margin-bottom: 8px;}
}

/* section01 */
@media(min-width:735px) {
    section.section01 .layout01 {padding:0 24px;}
}

/* section02 */
section.section02 .section-item {margin:30px 0}
section.section02 .layout02 .wrap-flex {gap:60px;align-items: flex-start;}
section.section02 .layout02 .wrap-img {max-width: 761px;display: flex;gap:17px;align-items: flex-start;}
section.section02 .layout02 .wrap-img .box-img {max-width: 372px;}
section.section02 .layout02 .wrap-img .box-img:nth-child(2) {margin-top: 162px;}
section.section02 .layout02 .box-text {flex-direction: column;gap:120px;display: flex;}

@media(min-width:1200px) {
    section.section02 .layout02 .wrap-img {margin-top: 70px;}
}

@media(max-width:1200px) {
    section.section02 .layout02 .wrap-flex {flex-wrap: wrap;gap:30px;justify-content: flex-end;}
    section.section02 .layout02 .box-text {gap:30px}
}

@media(min-width:735px) {
    .wrap-content section.section02 {padding: 36px 36px 24px 24px;}
    section.section02 .layout02 .wrap-img {min-width: 550px;flex: 1;}
}

@media(max-width:734px) {
    .wrap-content section.section02 {padding-bottom: 30px;}
    section.section02 .box-img.small {width:65%}
    section.section02 .section-item {margin:16px 0;}
    section.section02 .layout02 .wrap-flex {gap:16px}
    section.section02 .layout02 .box-text {gap:16px;}
    section.section02 .layout02 .box-text .flex-item:first-child {padding:0 10px 0 28px}
    section.section02 .layout02 .box-text .flex-item:last-child {padding:0 28px 0 10px;}
    section.section02 .layout02 .box-text .box-img {align-self: flex-end;margin-top: 8px;}
}


/* section03 */
section.section03 .section-item {margin:16px 0;}
section.section03 .layout02 .wrap-flex {align-items:flex-start;gap:16px;}
section.section03 .layout02 .box-img {max-width:708px;width:50%}

@media(min-width:1101px) {
    section.section03 .layout02 .box-img {margin-top:287px;}
    section.section03 .layout02 .wrap-flex {gap:112px;}
}

@media(min-width:735px) {
    section.section03 {padding:0 24px}
    section.section03 .layout02 .box-img {min-width:400px;}
}

@media(max-width:734px) {
    section.section03 .layout02 .box-text {padding-right:8px;}
    section.section03 .layout02 .box-img {width: 86%;}
}


/* section04 */
section.section04 .section-item {margin:16px 0;}
section.section04 .layout-inner {max-width:1145px}
section.section04 .layout01 .wrap-flex {justify-content:flex-end}

@media(max-width:734px) {
    .wrap-content section.section04 {padding-bottom:30px}
    section.section04 .section-item {margin:12px 0;}
    section.section04 .box-text {padding:0 14px;}
}


/* section05 */
section.section05 .section-item {margin:16px 0;}
section.section05 .layout-inner {max-width:1145px}
section.section05 .box-img {margin:16px 0;}
section.section05 .layout02 .wrap-flex {justify-content:flex-end}

@media(max-width:734px) {
    .wrap-content section.section05 {padding-bottom:30px}
    section.section05 .section-item {margin:12px 0;}
    section.section05 .layout01 .box-text {padding:0 14px;}
}