*{box-sizing: border-box; }
body{ font-family: 'LG EI'; margin: 0;padding: 0;overflow-x: hidden; background: #f0ece4; }
label,p,ul {margin: 0; padding: 0;}
ul { list-style: none;}
a{transition:ease all .5s}
button{transition:ease all .5s}
body a:hover { text-decoration: none; color: #7b0027}
body a:focus { outline: 0; text-decoration: none}
.form-control:focus{ box-shadow: none;}
button:focus{ box-shadow: none; outline: none;}
img {  max-width: 100%}
a{ color:#000; text-decoration: none; transition: .5s all;-webkit-transition: .5s all; -moz-transition: .5s all; -o-transition: .5s all; -ms-transition: .5s all;}
.stic {position: fixed!important;top: 0;z-index: 1000; background:#000!important; box-shadow: 1px 5px 15px rgba(0, 0, 0, .1);}
.btn.focus, .btn:focus {outline: 0; box-shadow: none; transition: .5s all;-webkit-transition: .5s all; -moz-transition: .5s all; -o-transition: .5s all; -ms-transition: .5s all;}
button{transition: .5s all;-webkit-transition: .5s all; -moz-transition: .5s all; -o-transition: .5s all; -ms-transition: .5s all;}
@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1488px;
    }

    .modal-lg, .modal-xl {
        max-width: 1100px;
    }
}
.d-image{display:block;}
.m-image{display:none;}
.menu-Bar{ display: none;}
.my-nav{ padding: 0px;}	 


header {width: 100%; padding: 10px 0; background: #fff; }
header .logo { width:120px;}
.header-main{ width: 100%; display: flex; justify-content:center; align-items: center;    }
header .logo img{ width: 100%;}
header .life-good{ width:180px;}
header .life-good img{ width: 100%;}
.main-wrapper{ width: 100%; padding:40px 0; position: relative;}

.main-banner-box{ padding:100px; background:url("../images/banner-bg.jpg"); background-repeat: no-repeat; background-position: center; width:100%; min-height: 440px;  display: flex; align-items: center; justify-content: center; border-radius: 20px; position: relative; overflow: hidden;}
.main-banner-box:before{content:''; position: absolute; left: -168px; bottom:-4px; width: 530px; height:332px; background:url("../images/m-boy.png"); background-repeat: no-repeat;}
.main-banner-box:after{content:''; position: absolute; right: -90px; bottom:-90px; width: 402px; height:444px; background:url("../images/m-girl.png"); background-repeat: no-repeat;}

.main-banner-box .banner-content h1{text-align: center; color:#fff;}
.main-banner-box .banner-content p{text-align: center; color:#fff; font-size: 1.5rem;}
.post-box{ width: 100%;}


.post-list{ width: 100%; margin-top: 50px;display:grid;  grid-template-columns: repeat(5, 1fr);gap: 15px; margin-bottom: 50px;}

.post-list .post-itam{ width: 100%; position: relative; }
.post-list .post-itam .imag-box{ width: 100%}
.post-list .post-itam .imag-box img{ width: 100%; border-radius: 15px;}
.post-list .post-itam .post-list-title{ width: 100%; padding: 15px; }
.post-list .post-itam .post-list-title a{ display: flex; align-items: center;}
.post-list .post-itam .post-list-title a h2{font-size: 1rem; line-height: 1.4rem; font-weight: 600; color:#333;letter-spacing: 1px; margin: 0px; text-align: center; width: 100%}


/*--- post detail page---*/
.post-wrapper{ width: 100%; padding-bottom: 20px;}
.banner{ width: 100%; margin:30px 0 50px;}
.banner img{ border-radius: 20px;}
.post-detail{ width: 100%;background: #fff;
    padding: 20px;
    border-radius: 20px; margin-bottom:30px; height: 100%}
.post-title{ width: 100%; margin-top: 50px;}
.post-title h1{color:#000; font-size: 2.5rem; line-height: 2.7rem;  font-weight: 800; letter-spacing: 1px; margin: 0px; text-align: center}
.post-title p{color:#333; font-size: 1.5rem; line-height: 1.7rem;   text-align: center;font-style: italic;}

.post-detail .post-contant{width: 100%; margin-bottom: 50px;}
.cn-box{ width: 100%; display: flex; gap:15px; flex-wrap: wrap;}
.cn-box .img-box{ flex:0 0 40%}
.cn-box .img-box img{ width: 100%; border-radius: 15px;}
.cn-box .text-box{flex:1}
.cn-box:last-child{ margin-bottom: 0px;}
.post-detail .post-contant p{ font-size: 1.2rem; line-height: 1.5rem; margin-bottom: 20px; text-align: justify;}
/*.post-detail .post-contant p:first-of-type::first-letter {font-size: 3rem; font-weight: 800;}*/
.post-detail .post-contant h2{color:#000; font-size: 1.6rem; line-height: 2.2rem;  font-weight: 800;  margin: 0px;}
.post-detail .post-contant .note{font-size: 1rem; line-height: 1.2rem; font-style: italic; margin-top: 15px;}

.related{ width: 100%; background: #fff; padding: 20px; border-radius: 20px; height: 100%; }
.related h2{ font-weight: 600; font-size:1.8rem; color:#a50034; margin-bottom: 15px;}
.related .rel-itam{ width: 100%; margin-bottom: 35px; display: flex;column-gap: 10px;align-items: center}

.related .rel-itam:last-child{margin-bottom:0;}
.related .rel-itam .rel-img-box { flex: 0 0 130px; height: 105px;}
.related .rel-itam .rel-img-box img { width: 100%;border-radius: 10px;height: 100%;object-fit: cover;}

.related .rel-itam h3{ margin-bottom: 0px;}
.related .rel-itam h3 a{ color:#333; font-size: 1rem;  line-height:1.2rem; font-weight: 600; display: inline-block;}
/*
.post-detail .post-gallery.grid-4{ display:grid;  grid-template-columns: repeat(4, 1fr);gap: 30px; margin-bottom: 50px;}
.post-detail .post-gallery.grid-3{ display:grid;  grid-template-columns: repeat(3, 1fr);gap: 30px; margin-bottom: 50px;}
.post-detail .post-gallery.grid-2{ display:grid;  grid-template-columns: repeat(2, 1fr);gap: 30px; margin-bottom: 50px;}
.post-detail .post-gallery .gallery-b{}
.post-detail .post-gallery .gallery-b img{ border-radius: 15px; transition: transform 0.3s ease, box-shadow 0.3s ease;cursor: pointer;}
.post-detail .post-gallery .gallery-b img:hover {transform: scale(1.05); box-shadow: 0 8px 16px rgba(0,0,0,0.3); }
*/

footer{ background:#333333; color:#ffffff;width:100%; float:left; box-sizing:border-box; padding:0.5%; font-family: 'LG EI'; }
.footer_nav{ width: 100%;margin: 0.5% 0%;}
.footer_sec .footer_nav ul{ margin:0; padding:0; list-style:none; display: flex;}
.footer_sec .footer_nav ul li{text-align: center; border-right: 1px solid #ffffff;font-size: 16px; }
.footer_sec .footer_nav ul li:last-child{ border-right: 0;}
.footer_sec .footer_nav ul li a{ color:#ffffff; text-decoration:none; font-size:14px; padding: 0 20px;}
.footer_sec .footer_nav ul li:first-child a{padding: 0 20px 0 0;}
.footer_sec p{ font-size: 16px;display: block;width: 100%;margin: 0;padding: 0; font-family: 'LG EI';}
.footer_sec p a{ color:#ffffff; font-family: 'LG EI';}
.ft_main {background: #333333;color: #ffffff;}
.foot-scan{ display: flex; justify-content: flex-end; align-items: flex-end;}



@media (max-width: 768px) {

 header .logo { width:80px;}
 header .logo img{ width: 100%;}
 header .life-good{ width:120px;}
 header .life-good img{ width: 100%;}


.footer_sec .footer_nav {margin-bottom:15px;}
.footer_sec .footer_nav ul{ justify-content: center;}
.footer_sec .footer_nav ul li:last-child a{padding-right: 0px;}
.footer_sec p{ text-align: center; line-height: 15px; margin-bottom: 10px;}
.footer_sec p:last-child{margin-bottom: 0px;}	
}




@media (max-width: 568px){
	.container{max-width:100%; }
	
	header {width: 100%; padding: 10px 0; }
	
	.d-image{display:none;}
	.m-image{display:block;}
	.main-box{ padding: 15px 8px;}
	.main-wrapper{padding: 15px 0 25px;}
	.banner{margin: 16px 0;}
	.main-banner-box{padding: 15px 35px 35px;    min-height: 307px;align-items: flex-start;}
	.main-banner-box .banner-content h1 {
    text-align: center;
    color: #fff;
    font-size: 1.5rem;
    font-weight: 800;
}
	.main-banner-box:before {left: -75px; bottom: -47px; width: 241px;height: 203px;background-size: contain;}
     .main-banner-box:after { right: -47px; bottom: -42px;width: 169px;height: 197px;background-size: contain;}
	.post-detail{ height: auto; margin-bottom: 20px;}
	.post-detail .post-contant{margin-bottom:0;}
	.post-detail .post-gallery{ margin-bottom: 10px;}
	.post-box .popular-post .post-title{ padding:15px;}
	.post-box .post-b .post-title{ padding: 15px;}
	.post-list .post-itam .post-list-title{padding: 15px 0 0;}
	.post-detail .post-title h1{font-size: 1.5rem;line-height: 1.7rem;letter-spacing: inherit;}
	.post-list .post-itam .post-list-title a .contant{flex: 0 0 85%;}
	.post-list .post-itam .post-list-title a h2{font-size: 1rem;line-height: 1.3rem;  font-weight: 800; letter-spacing: 0;}
	.post-box .post-b .post-title a .contant h2{font-size: 1rem;line-height: 1.3rem; letter-spacing: 0;}
	.post-title h1 {font-size: 1.6rem;line-height: 1.7rem; letter-spacing: 0;}
	.post-title p {font-size: 1.1rem;line-height: 1.3rem; letter-spacing: 0;}
	.post-list{grid-template-columns: repeat(2, 1fr);}
	.post-list .post-list-title{ padding:10px 0px 0px;}
	.post-list .post-list-title h2{ font-size:1.2rem; line-height: 1.3rem;  letter-spacing: 0px;}
	.related{height: auto;}
	.cn-box{ flex-wrap: wrap;}
	.cn-box .img-box{flex:0 0 100%}
	.cn-box .text-box{flex:0 0 100%}
	.post-detail .post-contant p{ font-size: 1rem;line-height: 1.5rem;}
    .post-detail .post-gallery.grid-4{ grid-template-columns: repeat(2, 1fr); gap:10px; margin-bottom: 20px;}
	.post-detail .post-gallery.grid-3{ grid-template-columns: repeat(2, 1fr);gap:10px; margin-bottom: 20px;}
	.post-detail .post-gallery.grid-2{ grid-template-columns: repeat(1, 1fr);gap:0px; margin-bottom: 20px;}
	.footer_sec .footer_nav ul li:first-child a {padding: 0 10px 0 0;}
    .footer_sec .footer_nav ul li a{padding: 0 10px;}
	.foot-scan{ justify-content: center; padding-top: 10px;}
	.footer_sec p {text-align: center; font-size: 12px;line-height: 15px;margin-bottom: 10px;}
	.foot-scan p{text-align: center; font-size: 12px;line-height: 15px;margin-bottom:0px;}
	.foot-scan img{  width: 160px; margin: 0 auto;}

}