@charset "UTF-8";
*, *:after, *:before { vertical-align: middle; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-osx-font-smoothing: subpixel-antialiased; -webkit-font-smoothing: subpixel-antialiased; -moz-font-smoothing: subpixel-antialiased; -ms-font-smoothing: subpixel-antialiased; -o-font-smoothing: subpixel-antialiased; }

body { position: relative; display: inline-block; width: 100%; margin: 0; padding: 0; color: #5a5a5a; font-size: 16px; text-align: center; font-family: "Noto Sans TC", "Roboto", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif; }
body::-moz-selection { color: white; background-color: #78baff; }
body::selection { color: white; background-color: #78baff; }

a { color: black; cursor: pointer; text-decoration: none !important; }
a:after, a:before { color: black; vertical-align: middle !important; }
a:hover { text-decoration: underline; }

button { outline: non !important; border-width: 0; }

select { outline: none !important; box-shadow: none !important; border-width: 0; }

p { margin-bottom: 0; }

header { position: relative; background: linear-gradient(to bottom, #79c4f0 0%, #bce2f7 81%, #bde2f7 81%); }
header .navbar { position: relative; padding: 1rem 0; z-index: 1; }
@media (max-width: 992px) { header .navbar { z-index: 1050; } }
header .navbar .container { display: flex; justify-content: space-between; align-items: center; }
header .navbar-left { display: flex; align-items: center; }
header .navbar-left .navbar-brand img { height: 50px; }
@media (max-width: 768px) { header .navbar-left .navbar-brand img { height: 40px; } }
header .navbar-left .social-links { display: flex; gap: 0.5rem; }
@media (max-width: 768px) { header .navbar-left .social-links { gap: .5rem; } }
header .navbar-left .social-links .social-link { color: #fbb03b; font-size: 1.25rem; transition: color 0.3s ease; }
header .navbar-left .social-links .social-link:hover { color: #fa9c09; }
header .navbar-right { display: flex; align-items: center; }
header .navbar-right .action-buttons { display: flex; align-items: center; gap: 1rem; }
@media (max-width: 992px) { header .navbar-right .action-buttons { margin-right: 12px; flex-direction: column; align-items: flex-start; } }
header .navbar-right .action-buttons .name-text { color: #FFFFFF; text-shadow: rgba(48, 56, 65, 0.5) 1px 2px 2px; }
header .navbar-right .action-buttons .nav-link { cursor: pointer; color: #FFFFFF; text-decoration: none; transition: color 0.3s ease; text-shadow: rgba(48, 56, 65, 0.5) 1px 2px 2px; }
header .navbar-right .action-buttons .nav-link:first-of-type, header .navbar-right .action-buttons .nav-link:nth-of-type(2) { position: relative; }
header .navbar-right .action-buttons .nav-link:first-of-type:after, header .navbar-right .action-buttons .nav-link:nth-of-type(2):after { content: ''; position: absolute; top: 50%; right: -0.5rem; transform: translateY(-50%) translateX(50%); display: inline-block; width: 4px; height: 4px; border-radius: 50%; background-color: #FFFFFF; }
header .navbar-right .action-buttons .nav-link:hover { color: #fff600; text-shadow: transparent 1px 2px 2px; }
header .navbar-right .btn-mobile-menu { padding: 0.2rem .8rem 0.3rem .8rem; border-radius: 0; background-color: #c4965f; box-shadow: 5px -5px 0 #ba7c41 inset, -5px 5px 0 #dcb97c inset; text-shadow: rgba(48, 56, 65, 0.5) 1px 2px 2px; }
header .navbar-right .btn-mobile-menu i { color: #FFFFFF; font-size: .9rem; }
header .navbar-right .btn-mobile-menu i:before { transform: scale(1.5); }
header .navbar-right .btn-mobile-menu:hover { box-shadow: 5px -5px 0 rgba(186, 124, 65, 0.5) inset, -5px 5px 0 rgba(220, 185, 124, 0.5) inset; }
header .navbar-right #offcanvasNavbar { background-color: #FEFBF0; max-width: 60%; }
header .navbar-right #offcanvasNavbar .offcanvas-body > div { padding-bottom: 1rem; }
header .navbar-right #offcanvasNavbar .offcanvas-body > div:not(:first-child) { padding-top: 1rem; }
header .navbar-right #offcanvasNavbar .offcanvas-body > div:not(:last-child) { border-bottom: 2px dashed #ffce87; }
header .hero-section { position: relative; z-index: 1; }
@media (max-width: 768px) { header .hero-section:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 50%; background-color: white; } }
@media (max-width: 992px) { header .hero-section:after { height: 60%; } }
header .hero-section .container { position: relative; z-index: 2; }
header .hero-section h1 { position: relative; margin-bottom: 0; z-index: 1; }
header .category-section { position: relative; margin: 0 auto; z-index: 1; background-color: #FFFFFF; }
@media (max-width: 768px) { header .category-section .row { align-items: center; } }
header .category-section .category-col:hover .default-img, header .category-section .category-col.active .default-img { display: none; }
header .category-section .category-col:hover .active-img, header .category-section .category-col.active .active-img { display: block; }
@media (max-width: 768px) { header .category-section .category-col:not(.active) img { max-width: 90%; } }
header .category-section .category-col:nth-of-type(1) { order: 1; }
header .category-section .category-col:nth-of-type(2) { order: 2; }
header .category-section .category-col:nth-of-type(3) { order: 3; }
header .category-section .category-col:nth-of-type(4) { order: 4; }
header .category-section .category-col:nth-of-type(5) { order: 5; }
header .category-section .category-item { flex-basis: calc(20%); padding: 0; text-align: center; cursor: pointer; }
header .category-section .category-item .default-img { display: block; }
header .category-section .category-item .active-img { display: none; }
header .category-section .category-item picture { display: block; }
header .category-section .category-item img { max-width: 100%; height: auto; }
header .cloud-bg { position: absolute; bottom: 0; left: 0; width: 100%; overflow: hidden; }
@media (max-width: 768px) { header .cloud-bg { top: 0; bottom: auto; } }
header .cloud-bg img { width: 100%; height: 100%; object-fit: contain; }

.text-brown { color: #6e4435; }

.text-orange { color: #fbb03b !important; }

.text-pink { color: #f09aa8; }

.text-pink2 { color: #dd7a8d; }

.text-blue { color: #56ace2; }

.text-green { color: #75cc92; }

.text-purple { color: #c38ccf; }

.text-red { color: #cc5f5f; }

.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.logo-img { width: 35%; }
@media (max-width: 768px) { .logo-img { width: 100%; } }

.notebox { display: inline-block; width: 100%; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; border: 3px solid #fe9aab; background-color: #fffcec; padding: 1rem; }

.obj-image { max-width: 15%; }
@media (max-width: 768px) { .obj-image { max-width: 40%; } }

.img-half { transform: scale(0.5); }

.numH { height: 95px; font-size: 3rem; text-align: center; }

input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Firefox */
input[type=number] { -moz-appearance: textfield; }

.star-list { position: absolute; top: 5px; left: 0; }

.star-left15 { padding-left: 15px; }

.login-btn-space { padding: 10px 0 12px 0 !important; }

.h-22 { height: 22px; }

.w-10 { width: 10%; }

.w-5 { width: 5%; }

.w-650 { max-width: 650px !important; }

.w-115 { width: 115px !important; }

.w-165 { width: 165px !important; }

.border-brown-left { border-left: 4px dotted #aa9272; }
@media (max-width: 768px) { .border-brown-left { border-left: 0; } }

.border-brown-top { border-top: 1px dotted #aa9272; }

.border-pink-bottom { border-bottom: 3px solid #f09aa8; }

.border-brown-bottom { border-bottom: 3px dotted #aa9272; }

.border-yellow-bottom { border-bottom: 3px dotted #ffce87; }

.border-brown-bottom-s { border-bottom: 1px solid #aa9272; }

.border-brown { border: 1px solid #aa9272; }

.border-orange, .border-brown2, .border-pink, .border-blue, .border-green, .border-purple { height: 3px; content: ''; background-repeat: repeat-x; }

.border-brown2 { background-image: url(../images/doll-brown.svg); }

.border-orange { background-image: url(../images/doll-orange.svg); }

.border-pink { background-image: url(../images/doll-pink.svg); }

.border-blue { background-image: url(../images/doll-blue.svg); }

.border-green { background-image: url(../images/doll-green.svg); }

.border-purple { background-image: url(../images/doll-purple.svg); }

.list-bg-unit01 { background-color: #FEFBEF; }

.list-bg-unit02 { background-color: #F7E8EA; }

.list-bg-unit03 { background-color: #DFECF2; }

.list-bg-unit04 { background-color: #E4F4E9; }

.list-bg-unit05 { background-color: #F2EAF4; }

.text-shadow-sm { text-shadow: rgba(48, 56, 65, 0.5) 1px 2px 2px; }

.f-13 { font-size: .8rem; }

.f-19 { font-size: 1.2rem; }

.price { display: inline-block; width: 100%; font-weight: bolder; font-size: 3rem; color: #6e4435; text-align: right; position: relative; padding-right: 23px; }
.price:before { display: inline-block; content: attr(title); position: absolute; top: 17px; left: 0; color: #6e4435; font-size: 1rem; }
.price:after { display: inline-block; content: "元"; position: absolute; bottom: 11px; right: 0; color: #6e4435; font-size: 1rem; }

.price2 { display: flex; justify-content: flex-end; align-items: center; width: 100%; font-weight: bolder; font-size: 1.2rem; color: #6e4435; text-align: right; position: relative; margin-top: 20px; }
.price2:before { display: inline-block; content: attr(title); color: #6e4435; font-size: 1rem; position: absolute; left: 0; }
.price2:after { display: inline-block; content: "元"; color: #6e4435; font-size: 1rem; padding-left: 10px; }

.price-red { display: inline-block; width: 100%; font-weight: bolder; font-size: 3rem; color: #bf0a0a; text-align: right; position: relative; padding-right: 23px; margin-top: -10px; }
.price-red:before { display: inline-block; content: attr(title); position: absolute; top: 17px; left: 0; color: #bf0a0a; font-size: 1rem; }
.price-red:after { display: inline-block; content: "元"; position: absolute; bottom: 11px; right: 0; color: #bf0a0a; font-size: 1rem; }

.booklist2 { font-size: 1rem; display: inline-block; width: 100%; color: #6e4435; text-align: left; margin-left: 10px; }
.booklist2:hover { color: #fbb03b; }
.booklist2:before { content: '\F309'; font-family: bootstrap-icons; color: #6e4435; margin-left: -15px; }

.next-btn { display: inline-block; padding: .5rem 1rem; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; border: 1px solid #6e4435; color: #6e4435; }
.next-btn:hover, .next-btn:active { background-color: #6e4435; color: white; }

.link-brown { display: inline-block; color: #6e4435; }
.link-brown:hover { text-decoration: underline !important; }

.link-blue { display: inline-block; color: #56ace2; background-color: transparent; border: 0; padding: 0; }
.link-blue:hover { text-decoration: underline !important; }

.title-slash-link { display: inline-block; width: 100%; font-size: 1.1rem; font-weight: 500; color: white; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; padding: 10px 0 12px 0; text-shadow: #c9a681 1px 2px 2px; box-shadow: 0 -5px 0 #bf955e inset; background: repeating-linear-gradient(130deg, #d4ab6b 0 13px, #d9b783 0 25px); }
.title-slash-link:hover { text-shadow: #c9a681 1px 2px 2px; box-shadow: 0 -5px 0 #bf955e inset; background: repeating-linear-gradient(130deg, #d9b783 0 13px, #d4ab6b 0 25px); }

.title-slash-grey { display: inline-block; pointer-events: none; cursor: default; width: 100%; font-size: 1.1rem; font-weight: 500; color: #7e7e7e; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; padding: 10px 0 12px 0; text-shadow: #ffffff 1px 2px 2px; box-shadow: 0 -5px 0 #a7a7a7 inset; background: repeating-linear-gradient(130deg, #cecece 0 13px, #c5c5c5 0 25px); }

.title-slash01, .title-slash02, .title-slash03, .title-slash04, .title-slash05, .title-slash06, .title-slash07 { display: inline-block; width: 100%; font-size: 1.1rem; font-weight: 500; color: white; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; padding: .3rem .5rem .5rem .5rem; }
.title-slash01.br15, .title-slash02.br15, .title-slash03.br15, .title-slash04.br15, .title-slash05.br15, .title-slash06.br15, .title-slash07.br15 { -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }

.title-slash01 { text-shadow: rgba(240, 141, 62, 0.8) 1px 2px 2px; box-shadow: 0 -5px 0 #d89032 inset; background: repeating-linear-gradient(130deg, #fbb03b 0 13px, #fabd5e 0 25px); }

.title-slash02 { text-shadow: rgba(198, 102, 125, 0.8) 1px 2px 2px; box-shadow: 0 -5px 0 #dd7a8d inset; background: repeating-linear-gradient(130deg, #f09aa8 0 13px, #f1abb5 0 25px); }

.title-slash03 { text-shadow: rgba(36, 103, 137, 0.8) 1px 2px 2px; box-shadow: 0 -5px 0 #3e99c6 inset; background: repeating-linear-gradient(130deg, #56ace2 0 13px, #76bae3 0 25px); }

.title-slash04 { text-shadow: rgba(46, 117, 61, 0.8) 1px 2px 2px; box-shadow: 0 -5px 0 #4aaf64 inset; background: repeating-linear-gradient(130deg, #75cc92 0 13px, #8ed3a3 0 25px); }

.title-slash05 { text-shadow: rgba(143, 93, 155, 0.8) 1px 2px 2px; box-shadow: 0 -5px 0 #bd7fcc inset; background: repeating-linear-gradient(130deg, #c38ccf 0 13px, #cda0d4 0 25px); }

.title-slash06 { text-shadow: rgba(143, 93, 155, 0.8) 1px 2px 2px; box-shadow: 0 -5px 0 #c99c1f inset; background: repeating-linear-gradient(130deg, #fdd657 0 13px, #ffcf32 0 25px); }

.title-slash07 { text-shadow: rgba(155, 106, 53, 0.8) 1px 2px 2px; box-shadow: 0 -5px 0 #9b6a35 inset; background: repeating-linear-gradient(130deg, #c4965f 0 13px, #cea87b 0 25px); }

.btn-square { display: inline-block; padding: 0.3rem 1.5rem 0.4rem 1.5rem; text-decoration: none; border: 0 !important; color: white; font-weight: 400; text-shadow: rgba(48, 56, 65, 0.5) 1px 2px 2px; }
.btn-square.orange { background-color: #ffab3b; box-shadow: 5px -5px 0 #f08d3e inset, -5px 5px 0 #f7c766 inset; }
.btn-square.orange:hover, .btn-square.orange:active { box-shadow: 5px -5px 0 rgba(240, 141, 62, 0.5) inset, -5px 5px 0 rgba(247, 199, 102, 0.5) inset; }
.btn-square.brown { background-color: #c4965f; box-shadow: 5px -5px 0 #ba7c41 inset, -5px 5px 0 #dcb97c inset; }
.btn-square.brown:hover, .btn-square.brown:active { box-shadow: 5px -5px 0 rgba(186, 124, 65, 0.5) inset, -5px 5px 0 rgba(220, 185, 124, 0.5) inset; }
.btn-square.pink { background-color: #fe95a7; box-shadow: 5px -5px 0 #ed6179 inset, -5px 5px 0 #ffb6c5 inset; }
.btn-square.pink:hover, .btn-square.pink:active { box-shadow: 5px -5px 0 rgba(237, 97, 121, 0.5) inset, -5px 5px 0 rgba(255, 182, 197, 0.5) inset; }
.btn-square.blue { background-color: #2fade7; box-shadow: 5px -5px 0 #009acb inset, -5px 5px 0 #66d0f4 inset; }
.btn-square.blue:hover, .btn-square.blue:active { box-shadow: 5px -5px 0 rgba(0, 154, 203, 0.5) inset, -5px 5px 0 rgba(102, 208, 244, 0.5) inset; }

.page-item { margin: 0 3px; }
.page-item:first-child .page-link { line-height: 18px; border-top-left-radius: 20px !important; border-bottom-left-radius: 20px !important; }
.page-item:last-child .page-link { line-height: 18px; border-top-right-radius: 20px !important; border-bottom-right-radius: 20px !important; }
.page-item .page-link { width: 35px; height: 35px; line-height: 23px; color: #B3B7C6 !important; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; border-color: #6e4435 !important; color: #6e4435 !important; }
.page-item .page-link:hover, .page-item .page-link:active, .page-item .page-link.active-page { color: white !important; background-color: #cfa57b !important; border: 0; }
.page-item .page-link > span { vertical-align: baseline; }

.nav-btn { padding: 0.3rem 1.5rem 0.4rem 1.5rem; text-decoration: none; border-radius: 0; color: #FFFFFF; font-weight: 400; text-shadow: rgba(48, 56, 65, 0.5) 1px 2px 2px; }
@media (max-width: 768px) { .nav-btn { padding: 0.3rem .8rem 0.4rem .8rem; } }
.nav-btn-login { background-color: #ffab3b; box-shadow: 5px -5px 0 #f08d3e inset, -5px 5px 0 #f7c766 inset; }
.nav-btn-login:hover { box-shadow: 5px -5px 0 rgba(240, 141, 62, 0.5) inset, -5px 5px 0 rgba(247, 199, 102, 0.5) inset; }
.nav-btn-search { background-color: #c4965f; box-shadow: 5px -5px 0 #ba7c41 inset, -5px 5px 0 #dcb97c inset; }
.nav-btn-search:hover { box-shadow: 5px -5px 0 rgba(186, 124, 65, 0.5) inset, -5px 5px 0 rgba(220, 185, 124, 0.5) inset; }

.accordion { --bs-accordion-btn-active-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14px" height="8px" viewBox="0 0 14 8" version="1.1"><title>download</title><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"><g id="download" transform="translate(1, 1)" stroke="%23FFFFFF"><polyline id="路徑" points="0 0 6 6 12 0"/></g></g></svg>') !important; --bs-accordion-btn-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14px" height="8px" viewBox="0 0 14 8" version="1.1"><title>download</title><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"><g id="download" transform="translate(1, 1)" stroke="%23FFFFFF"><polyline id="路徑" points="0 0 6 6 12 0"/></g></g></svg>') !important; }

.accordion-item { border: 0 !important; margin-bottom: 15px; }

.accordion-button { border-top-left-radius: var(--bs-accordion-inner-border-radius); border-top-right-radius: var(--bs-accordion-inner-border-radius); border-bottom-left-radius: var(--bs-accordion-inner-border-radius); border-bottom-right-radius: var(--bs-accordion-inner-border-radius); color: white !important; }
.accordion-button.qa-background { background-color: #c4965f !important; }

.accordion-body { text-align: left; }

.accordion-button:not(.collapsed) { color: white !important; }
.accordion-button:not(.collapsed).qa-background { background-color: #c4965f !important; }

.accordion-item:first-of-type > .accordion-header .accordion-button { border-top-left-radius: var(--bs-accordion-inner-border-radius); border-top-right-radius: var(--bs-accordion-inner-border-radius); border-bottom-left-radius: var(--bs-accordion-inner-border-radius); border-bottom-right-radius: var(--bs-accordion-inner-border-radius); }

.modal-header { border-bottom: 0 !important; }

.modal-footer { border-top: 0 !important; }

.form-check-input { border: 1px solid #9a836c !important; }

.form-select, .form-control { border-radius: 0.375rem !important; color: #6e4435; background-color: white !important; }
.form-select.border-brown-box, .form-control.border-brown-box { border: 1px solid #9a836c !important; }
.form-select:focus, .form-control:focus { color: #6e4435 !important; }
.form-select::placeholder, .form-control::placeholder { color: #c1c1c1; }

.nav-pills .nav-link { padding: .5rem 1.5rem !important; border-radius: 5px 5px 0 0 !important; color: white; background-color: #d3c7bc !important; }
.nav-pills .nav-link.active { background-color: #f09aa8 !important; }

.table { color: #5e5e5e !important; font-weight: 300; }
.table .table-warning { background-color: #c9a681 !important; border-radius: 30px !important; }
.table .table > :not(caption) > * > * { background-color: #c9a681 !important; }
.table tr { border-bottom: 1px solid #d6bca0; }

.navbar { z-index: 3 !important; }

.checkEye, .checkEye2 { position: absolute; top: 73%; right: 20px; transform: translateY(-50%); }
.checkEye.m-use, .checkEye2.m-use { top: 47%; right: 14px; }

.checkEye3 { position: absolute; top: 71%; right: 19px; transform: translateY(-50%); }
.checkEye3.m-use { top: 71%; right: 19px; }

.scroll-boxs { display: inline-block; width: 100%; max-height: 550px; overflow-y: scroll; }
@media (max-width: 768px) { .scroll-boxs { max-height: 350px; } }
.scroll-boxs > a { color: #0d6efd; }

@media (min-width: 992px) { .category-col { padding: 0 12px !important; }
  .category-col picture { position: relative; width: 100%; height: auto; aspect-ratio: auto; }
  .category-col picture img { width: 100%; height: auto; object-fit: cover; } }

main { position: relative; z-index: 1; }
main.page01 .age-section .age-item:hover a, main.page01 .age-section .age-item.active a { color: #fbb03b; }
main.page01 .age-section .age-item .age-item-img > img { transform: translateY(-35%); }
main.page01 .main-section .sidebar-item.active, main.page01 .main-section .sidebar-item:hover { background-color: #fbb03b; }
main.page02 .age-section .age-item:hover a, main.page02 .age-section .age-item.active a { color: #f09aa8; }
main.page02 .age-section .age-item .age-item-img > img { transform: translateY(-15%); }
main.page02 .main-section .sidebar-swiper .sidebar-item.active, main.page02 .main-section .sidebar-swiper .sidebar-item:hover { background-color: #f09aa8; }
main.page02 .main-section .sidebar-swiper .sidebar-item a { justify-content: flex-start; }
main.page02 .main-section .sidebar-swiper .sidebar-item a .sidebar-item-text { display: flex; }
@media (max-width: 576px) { main.page02 .main-section .sidebar-swiper .sidebar-item a .sidebar-item-text { flex-direction: column; } }
main.page03 .main-section .sidebar-swiper .sidebar-item.active, main.page03 .main-section .sidebar-swiper .sidebar-item:hover { background-color: #56ace2; }
main.page03 .main-section .sidebar-swiper .sidebar-item a { justify-content: flex-start; }
main.page03 .main-section .sidebar-swiper .sidebar-item a .sidebar-item-text { text-align: left; }
@media (max-width: 992px) { main.page04 .main-section .select-wrapper { text-align: left; } }
main.page04 .main-section .select-wrapper .dropdown-toggle { position: relative; }
main.page04 .main-section .select-wrapper .dropdown-toggle.show:after { transform: rotate(180deg) translateY(50%); }
main.page04 .main-section .select-wrapper .dropdown-toggle:after { content: ''; border: none; position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-size: 16px 16px; background-repeat: no-repeat; width: 1rem; height: 1rem; transition: transform 0.3s ease; }
main.page04 .main-section .sidebar04-swiper .sidebar-item.cant-play { pointer-events: none; cursor: default; background-color: #c1c1c1; }
main.page04 .main-section .sidebar04-swiper .sidebar-item.active, main.page04 .main-section .sidebar04-swiper .sidebar-item:hover { background-color: #75cc92; }
main.page05 .main-section .sidebar-swiper .sidebar-item.active, main.page05 .main-section .sidebar-swiper .sidebar-item:hover { background-color: #c38ccf; }
main.page06 .age-section .age-item:hover a, main.page06 .age-section .age-item.active a { color: #fbb03b; }
main.page06 .age-section .age-item .age-item-img > img { transform: translateY(-35%); }
main.page06 .main-section .sidebar-swiper .sidebar-item.active, main.page06 .main-section .sidebar-swiper .sidebar-item:hover { background-color: #f9c85d; }
main.page07 .age-section .age-item:hover a, main.page07 .age-section .age-item.active a { color: #fbb03b; }
main.page07 .age-section .age-item .age-item-img > img { transform: translateY(-35%); }
main.page07 .main-section .sidebar-swiper .sidebar-item.active, main.page07 .main-section .sidebar-swiper .sidebar-item:hover { background-color: #c4965f; }
main .age-section { margin: 0 auto; }
@media (max-width: 992px) { main .age-section .age-swiper { padding: 0 15px; } }
main .age-section .age-swiper .swiper-slide { width: auto; }
@media (min-width: 992px) { main .age-section .age-swiper .swiper-slide { margin-right: 30px; } }
@media (max-width: 992px) { main .age-section .age-swiper .swiper-slide { width: calc(100% / 3); } }
main .age-section .age-swiper .swiper-button-prev, main .age-section .age-swiper .swiper-button-next { width: auto; color: #FFB74D; }
main .age-section .age-swiper .swiper-button-prev:after, main .age-section .age-swiper .swiper-button-next:after { font-size: 20px; }
main .age-section .age-swiper .swiper-button-prev { left: 0; }
main .age-section .age-swiper .swiper-button-next { right: 0; }
main .age-section .age-item { text-align: center; cursor: pointer; }
main .age-section .age-item:hover a, main .age-section .age-item.active a { color: #fbb03b; }
main .age-section .age-item:hover a .age-item-img .default-img, main .age-section .age-item.active a .age-item-img .default-img { display: none; }
main .age-section .age-item:hover a .age-item-img .active-img, main .age-section .age-item.active a .age-item-img .active-img { display: inline-block; }
main .age-section .age-item a { display: flex; align-items: center; justify-content: center; color: #6e4435; }
main .age-section .age-item a .age-item-img .default-img { display: inline-block; }
main .age-section .age-item a .age-item-img .active-img { display: none; }
main .age-section .age-item a .age-item-img > img { max-width: 35.5px; }
@media (max-width: 576px) { main .age-section .age-item a .age-item-img > img { max-width: 20px; } }
main .age-section .age-item a .age-item-text { display: flex; flex-direction: column; align-items: center; justify-content: center; margin-left: 0.5rem; }
main .age-section .age-item a .age-item-text span { text-align: left; font-size: 1.25rem; }
@media (max-width: 576px) { main .age-section .age-item a .age-item-text span { font-size: 1rem; } }
main .age-section .age-item a .age-item-text span.sm-text-age { font-size: .9rem; }
@media (max-width: 576px) { main .age-section .age-item a .age-item-text span.sm-text-age { font-size: 13px; line-height: 1; } }
main .breadcrumb-section { margin-top: 16px; }
main .breadcrumb-section li { font-size: 14px; color: #A1A1A1; }
main .breadcrumb-section li.active { color: #A1A1A1; }
main .breadcrumb-section a { color: #A1A1A1; text-decoration: none; vertical-align: baseline !important; }
main .breadcrumb-section a:hover, main .breadcrumb-section a:active { color: #6e4435; }
@media (min-width: 992px) { main .main-section .col-lg-3:has(.sidebar) { max-width: 20%; } }
@media (min-width: 992px) { main .main-section .col-lg-9:has(.content) { max-width: 80%; } }
main .main-section .sidebar-swiper { padding: 1rem; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }
@media (max-width: 768px) { main .main-section .sidebar-swiper { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } }
@media (max-width: 992px) { main .main-section .sidebar-swiper .select-wrapper { text-align: left; } }
main .main-section .sidebar-swiper .select-wrapper > p { font-size: 1.1rem; color: #f09aa8; }
@media (max-width: 992px) { main .main-section .sidebar-swiper .select-wrapper > p { display: inline-block; } }
main .main-section .sidebar-swiper .select-wrapper > .form-select { padding: 0.3rem 0.5rem; color: #f09aa8; font-size: 1.125rem; border: 2px solid #f09aa8; border-radius: 100px; background-color: transparent; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23f09aa8' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-position: right 1rem center; cursor: pointer; border-radius: 30px !important; }
@media (max-width: 992px) { main .main-section .sidebar-swiper .select-wrapper > .form-select { display: inline-block; width: 50%; } }
main .main-section .sidebar-swiper .select-wrapper > .form-select:focus { box-shadow: none; border-color: #f09aa8; }
main .main-section .sidebar-swiper .select-wrapper > .form-select option { color: #f09aa8; background-color: #FFFFFF; }
main .main-section .sidebar-swiper .sidebar-accordion .accordion-item .accordion-button:after { filter: brightness(0) invert(1); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23052c65' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e"); font-weight: bold; }
@media (min-width: 992px) { main .main-section .sidebar-swiper .swiper-wrapper { flex-direction: column; } }
@media (min-width: 992px) { main .main-section .sidebar-swiper .swiper-wrapper .swiper-slide { margin-bottom: 10px; } }
@media (max-width: 992px) { main .main-section .sidebar-swiper .swiper-wrapper .swiper-slide { width: calc(100% / 2.2); } }
main .main-section .sidebar-swiper .sidebar-item { border-radius: 30px; background-color: #FFFFFF; text-align: start; cursor: pointer; overflow: hidden; }
main .main-section .sidebar-swiper .sidebar-item:not(:last-child) { margin-bottom: 1rem; }
main .main-section .sidebar-swiper .sidebar-item:hover .sidebar-item-img .default-img, main .main-section .sidebar-swiper .sidebar-item.active .sidebar-item-img .default-img { display: none; }
main .main-section .sidebar-swiper .sidebar-item:hover .sidebar-item-img .active-img, main .main-section .sidebar-swiper .sidebar-item.active .sidebar-item-img .active-img { display: inline-block; }
main .main-section .sidebar-swiper .sidebar-item:hover .sidebar-item-text span, main .main-section .sidebar-swiper .sidebar-item.active .sidebar-item-text span { color: white; }
main .main-section .sidebar-swiper .sidebar-item a { display: flex; align-items: center; justify-content: flex-start; padding: 0.5rem 0.5rem; text-decoration: none; color: #6e4435; font-weight: 500; }
@media (max-width: 992px) { main .main-section .sidebar-swiper .sidebar-item a { text-align: center; } }
@media (max-width: 576px) { main .main-section .sidebar-swiper .sidebar-item a { font-size: 14px; padding: 0 0.25rem; } }
@media (max-width: 320px) { main .main-section .sidebar-swiper .sidebar-item a { font-size: 12px; } }
main .main-section .sidebar-swiper .sidebar-item a .sidebar-item-img { margin-right: 0.5rem; text-align: center; }
main .main-section .sidebar-swiper .sidebar-item a .sidebar-item-img .default-img { display: inline-block; }
main .main-section .sidebar-swiper .sidebar-item a .sidebar-item-img .active-img { display: none; }
@media (max-width: 576px) { main .main-section .sidebar-swiper .sidebar-item a .sidebar-item-img { margin-right: 0.25rem; margin-left: 0.25rem; padding: 0.5rem 0; } }
main .main-section .sidebar-swiper .sidebar-item a .sidebar-item-img > img { max-width: 25.5px; }
main .main-section .sidebar-swiper .sidebar-item a .sidebar-item-text span { color: #6e4435; }
main .main-section .sidebar04-swiper { padding: 1rem; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }
@media (max-width: 992px) { main .main-section .sidebar04-swiper { padding: 0 1rem 1rem 1rem; } }
@media (max-width: 768px) { main .main-section .sidebar04-swiper { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } }
main .main-section .sidebar04-swiper .sidebar-accordion .accordion-item:not(:last-child) { margin-bottom: 1rem; }
main .main-section .sidebar04-swiper .sidebar-accordion .accordion-item .accordion-button:after { filter: brightness(0) invert(1); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23052c65' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e"); font-weight: bold; }
main .main-section .sidebar04-swiper .sidebar-accordion .accordion-item .accordion-collapse { margin-top: 1rem; }
main .main-section .sidebar04-swiper .sidebar-item { border-radius: 30px; background-color: #FFFFFF; text-align: start; cursor: pointer; overflow: hidden; }
main .main-section .sidebar04-swiper .sidebar-item:not(:last-child) { margin-bottom: 1rem; }
main .main-section .sidebar04-swiper .sidebar-item:hover .sidebar-item-img .default-img, main .main-section .sidebar04-swiper .sidebar-item.active .sidebar-item-img .default-img { display: none; }
main .main-section .sidebar04-swiper .sidebar-item:hover .sidebar-item-img .active-img, main .main-section .sidebar04-swiper .sidebar-item.active .sidebar-item-img .active-img { display: inline-block; }
main .main-section .sidebar04-swiper .sidebar-item:hover .sidebar-item-text span, main .main-section .sidebar04-swiper .sidebar-item.active .sidebar-item-text span { color: white; vertical-align: baseline; }
main .main-section .sidebar04-swiper .sidebar-item a { display: flex; align-items: center; justify-content: flex-start; padding: 0.5rem 0.5rem; text-decoration: none; color: #6e4435; font-weight: 500; }
@media (max-width: 992px) { main .main-section .sidebar04-swiper .sidebar-item a { text-align: center; } }
@media (max-width: 576px) { main .main-section .sidebar04-swiper .sidebar-item a { font-size: 14px; padding: 0 0.25rem; } }
@media (max-width: 320px) { main .main-section .sidebar04-swiper .sidebar-item a { font-size: 12px; } }
main .main-section .sidebar04-swiper .sidebar-item a .sidebar-item-img { margin-right: 0.5rem; text-align: center; }
main .main-section .sidebar04-swiper .sidebar-item a .sidebar-item-img .default-img { display: inline-block; }
main .main-section .sidebar04-swiper .sidebar-item a .sidebar-item-img .active-img { display: none; }
@media (max-width: 576px) { main .main-section .sidebar04-swiper .sidebar-item a .sidebar-item-img { margin-right: 0.5rem; margin-left: 0.25rem; padding: 0.5rem 0; } }
main .main-section .sidebar04-swiper .sidebar-item a .sidebar-item-img > img { max-width: 25.5px; }
main .main-section .sidebar04-swiper .sidebar-item a .sidebar-item-text span { color: #6e4435; vertical-align: baseline; }
main .main-section .content { display: flex; flex-wrap: wrap; row-gap: 1rem; column-gap: 1.3rem; justify-content: flex-start; }
@media (max-width: 768px) { main .main-section .content { column-gap: 1rem; } }
main .main-section .content.content-5 { column-gap: 1rem; justify-content: flex-start; }
main .main-section .content .item { flex: 0 0 calc(25% - 0.5rem); max-width: calc(25% - 1rem); }
@media (max-width: 992px) { main .main-section .content .item { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - 0.5rem); } }
main .main-section .content .item.add-big { flex: 0 0 calc(33% - 0.5rem); max-width: calc(33% - 2rem); }
@media (max-width: 768px) { main .main-section .content .item.add-big { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - 0.5rem); } }
@media (min-width: 1200px) { main .main-section .content .item:hover .overlay { display: block; } }
main .main-section .content .item .mo-list { display: inline-block; width: 40px; height: 40px; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; background-color: #fbb03b; z-index: 99; position: absolute; top: -8px; left: -5px; line-height: 33px; }
main .main-section .content .item picture { position: relative; display: block; width: 100%; height: auto; background-color: #FFFFFF; border-radius: 15px; aspect-ratio: 1/.959; overflow: hidden; }
main .main-section .content .item picture.video-4 { aspect-ratio: 1.989/1; }
@media (max-width: 1200px) { main .main-section .content .item picture:hover .overlay { display: block; } }
main .main-section .content .item picture img { display: block; width: 100%; height: 100%; padding: 0; object-fit: contain; position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-position: center; }
main .main-section .content .item picture .overlay { display: none; position: absolute; top: 0; left: 0; padding: .5rem; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); border-radius: 15px; }
main .main-section .content .item picture .overlay .text { font-size: 14px; color: #FFFFFF; text-align: start; }
main .main-section .content .item picture .overlay a.booklist { font-size: .8rem; display: inline-block; width: 100%; color: white; margin-left: 10px; }
main .main-section .content .item picture .overlay a.booklist:hover { color: #fbb03b; }
main .main-section .content .item picture .overlay a.booklist:before { content: '\F309'; font-family: bootstrap-icons; color: white; margin-left: -13px; }
main .main-section .content .item picture .overlay a.btn-unit { display: inline-block; padding: 0.3rem 0; width: calc(100% - 2rem); font-size: .9rem; color: #FFFFFF; background-color: #fbb03b; border-radius: 30px; }
main .main-section .content .item picture .overlay a.btn-unit:hover { background-color: #d89032; }
main .main-section .content .item picture .overlay a.more { position: absolute; bottom: 1rem; left: 1rem; padding: 0.3rem 0; width: calc(100% - 2rem); font-size: .9rem; color: #FFFFFF; background-color: #fbb03b; border-radius: 30px; }
main .main-section .content .item picture .overlay a.more:hover { background-color: #d89032; }
main .main-section .content .item .book-name { display: block; margin-top: .5rem; font-size: 1rem; color: #6e4435; }
main .main-section .content .item .book-name:hover { text-decoration: underline !important; }
main .main-section .content .item-page05 { flex: 0 0 calc(25% - 0.5rem); max-width: calc(25% - 1rem); }
@media (max-width: 992px) { main .main-section .content .item-page05 { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - 0.5rem); } }
main .main-section .content .item-page05:hover .overlay { display: block; }
main .main-section .content .item-page05 picture { position: relative; display: block; width: 100%; height: auto; background-color: #FFFFFF; border-radius: 15px; aspect-ratio: 1.34/1; overflow: hidden; }
main .main-section .content .item-page05 picture.video-4 { aspect-ratio: 1.989/1; }
main .main-section .content .item-page05 picture img { display: block; width: 100%; height: 100%; padding: 0; object-fit: contain; position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-position: center; }
main .main-section .content .item-page05 picture .overlay { display: none; position: absolute; top: 0; left: 0; padding: .5rem; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); border-radius: 15px; }
main .main-section .content .item-page05 picture .overlay .text { font-size: 14px; color: #FFFFFF; text-align: start; }
main .main-section .content .item-page05 picture .overlay a.booklist { font-size: .8rem; display: inline-block; width: 100%; color: white; }
main .main-section .content .item-page05 picture .overlay a.booklist:hover { color: #fbb03b; }
main .main-section .content .item-page05 picture .overlay a.booklist:before { content: '\F309'; font-family: bootstrap-icons; color: white; }
main .main-section .content .item-page05 picture .overlay a.more { position: absolute; bottom: 1rem; left: 1rem; padding: 0.3rem 0; width: calc(100% - 2rem); font-size: .9rem; color: #FFFFFF; background-color: #fbb03b; border-radius: 30px; }
main .main-section .content .item-page05 picture .overlay a.more:hover { background-color: #d89032; }
main .main-section .content .item-page05 .book-name { display: block; margin-top: .5rem; font-size: 1rem; color: #6e4435; }
main .main-section .content .item-page05 .book-name:hover { text-decoration: underline !important; }
main .main-section .content .item-3 { flex: 0 0 calc(100% / 3 - 0.5rem); max-width: calc(100% / 3 - .9rem); }
@media (max-width: 992px) { main .main-section .content .item-3 { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - 0.5rem); } }
main .main-section .content .item-3:hover .overlay { display: block; }
main .main-section .content .item-3 picture { position: relative; display: block; width: 100%; height: auto; background-color: #FFFFFF; border-radius: 15px; aspect-ratio: .89/.5; overflow: hidden; }
main .main-section .content .item-3 picture img { display: block; width: 100%; height: 100%; padding: 0; object-fit: contain; position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-position: center; }
main .main-section .content .item-3 picture .overlay { display: none; position: absolute; top: 0; left: 0; padding: .5rem; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); border-radius: 15px; }
main .main-section .content .item-3 picture .overlay .text { font-size: 14px; color: #FFFFFF; text-align: start; }
main .main-section .content .item-3 picture .overlay a.booklist { font-size: .8rem; display: inline-block; width: 100%; color: white; }
main .main-section .content .item-3 picture .overlay a.booklist:hover { color: #fbb03b; }
main .main-section .content .item-3 picture .overlay a.booklist:before { content: '\F309'; font-family: bootstrap-icons; color: white; }
main .main-section .content .item-3 picture .overlay a.more { position: absolute; bottom: 1rem; left: 1rem; padding: 0.3rem 0; width: calc(100% - 2rem); font-size: .9rem; color: #FFFFFF; background-color: #fbb03b; border-radius: 30px; }
main .main-section .content .item-3 picture .overlay a.more:hover { background-color: #d89032; }
main .main-section .content .item-3 .book-name { display: block; margin-top: .5rem; font-size: 1rem; color: #6e4435; }
main .main-section .content .item-3 .book-name:hover { text-decoration: underline !important; }
main .main-section .content .item-5 { flex: 0 0 calc(100% / 5 - 0.5rem); max-width: calc(100% / 5 - .9rem); }
@media (max-width: 992px) { main .main-section .content .item-5 { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - 0.5rem); } }
main .main-section .content .item-5:hover .overlay { display: block; }
main .main-section .content .item-5 picture { position: relative; display: block; width: 100%; height: auto; background-color: #FFFFFF; border-radius: 15px; aspect-ratio: 1/.959; overflow: hidden; }
main .main-section .content .item-5 picture img { display: block; width: 100%; height: 100%; padding: 0; object-fit: contain; position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-position: center; }
main .main-section .content .item-5 picture .overlay { display: none; position: absolute; top: 0; left: 0; padding: .5rem; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); border-radius: 15px; }
main .main-section .content .item-5 picture .overlay .text { font-size: 14px; color: #FFFFFF; text-align: start; }
main .main-section .content .item-5 picture .overlay a.booklist { font-size: .8rem; display: inline-block; width: 100%; color: white; }
main .main-section .content .item-5 picture .overlay a.booklist:hover { color: #fbb03b; }
main .main-section .content .item-5 picture .overlay a.booklist:before { content: '\F309'; font-family: bootstrap-icons; color: white; }
main .main-section .content .item-5 picture .overlay a.more { position: absolute; bottom: 1rem; left: 1rem; padding: 0.3rem 0; width: calc(100% - 2rem); font-size: .9rem; color: #FFFFFF; background-color: #fbb03b; border-radius: 30px; }
main .main-section .content .item-5 picture .overlay a.more:hover { background-color: #d89032; }
main .main-section .content .item-5 .book-name { display: block; margin-top: .5rem; font-size: 1rem; color: #6e4435; }
main .main-section .content .item-5 .book-name:hover { text-decoration: underline !important; }
main .main-section .content .item-5-1 { flex: 0 0 calc(100% / 5 - 0.5rem); max-width: calc(100% / 5 - .9rem); }
@media (max-width: 992px) { main .main-section .content .item-5-1 { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - 0.5rem); } }
main .main-section .content .item-5-1:hover .overlay { display: block; }
main .main-section .content .item-5-1 picture { position: relative; display: block; width: 100%; height: auto; background-color: #FFFFFF; border-radius: 15px; aspect-ratio: 1/1; overflow: hidden; }
main .main-section .content .item-5-1 picture img { display: block; width: 100%; height: 100%; padding: 0; object-fit: contain; position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-position: center; }
main .main-section .content .item-5-1 picture .overlay { display: none; position: absolute; top: 0; left: 0; padding: .5rem; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); border-radius: 15px; }
main .main-section .content .item-5-1 picture .overlay .text { font-size: 14px; color: #FFFFFF; text-align: start; }
main .main-section .content .item-5-1 picture .overlay a.booklist { font-size: .8rem; display: inline-block; width: 100%; color: white; }
main .main-section .content .item-5-1 picture .overlay a.booklist:hover { color: #fbb03b; }
main .main-section .content .item-5-1 picture .overlay a.booklist:before { content: '\F309'; font-family: bootstrap-icons; color: white; }
main .main-section .content .item-5-1 picture .overlay a.more { position: absolute; bottom: 1rem; left: 1rem; padding: 0.3rem 0; width: calc(100% - 2rem); font-size: .9rem; color: #FFFFFF; background-color: #fbb03b; border-radius: 30px; }
main .main-section .content .item-5-1 picture .overlay a.more:hover { background-color: #d89032; }
main .main-section .content .item-5-1 .book-name { display: block; margin-top: .5rem; font-size: 1rem; color: #6e4435; }
main .main-section .content .item-5-1 .book-name:hover { text-decoration: underline !important; }
main.about { position: relative; margin-top: 1rem; overflow: hidden; background-color: #FAE8B2; }
main.about .title-section { position: relative; z-index: 2; }
main.about .title-section .about-img-box { position: relative; }
main.about .title-section .about-img-box img { position: relative; width: 25%; z-index: 3; }
main.about .title-section .about-img-box:before { content: ''; position: absolute; top: 0; left: 50%; right: 0; bottom: 0; width: 100vw; transform: translateX(-50%); background-color: #FFFFFF; z-index: -1; }
main.about .title-section .about-title { position: relative; z-index: 2; }
main.about .title-section .about-title h2 { position: relative; bottom: 1rem; color: #dd7a8d; border-color: #dd7a8d; border-style: solid; background-color: #FFFFFF; z-index: 2; font-size: calc(1.325rem + .9vw); }
@media (max-width: 576px) { main.about .title-section .about-title h2 { font-size: 1.25rem; } }
main.about .title-section .about-title:before { content: ''; position: absolute; top: 0; left: 50%; right: 0; bottom: 0; width: 100vw; height: calc(50% - 1rem); transform: translateX(-50%); background-color: #FFFFFF; z-index: -2; }
main.about .about-section { position: relative; z-index: 2; }
main.about .about-section .about-img-box { position: absolute; width: 25%; z-index: 0; }
main.about .about-section .about-img-box img { width: 100%; }
main.about .about-section .about-img-box.left-img { top: 0; left: 0; transform: translate(-60%, -10%); }
main.about .about-section .about-img-box.right-img { right: 0; bottom: 0; transform: translate(60%, -10%); }
@media (max-width: 576px) { main.about .about-section .about-img-box.right-img { transform: translate(50%, 10%); } }
main.about .about-section .content-box { position: relative; background-color: #FFFFFF; border-color: #C6A880; border-style: solid; z-index: 1; }
main.about .bg-color { position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 0; background-color: #FAE8B2; }

footer { background-color: #fffdf9; }
footer .page-footer { background-image: url(../images/page-footer-bg.svg); background-color: #A4D3AD; }
@media (max-width: 992px) { footer { text-align: center; } }
footer .copyright { color: #6e4435; font-size: .8rem; margin: 0; }

.nav-btn-search { border: 0; }

.s-p-x60 { padding: 0 60px !important; }

.terms-use { list-style-type: decimal !important; }
