.clear_both{ display:block; clear:both}

.gallery-theme .article{ float:none; display:block; width:100%; margin:auto; padding:20px 16px}
.gallery-theme .article>span{ font-size:18px; color:#666; display:block; padding:10px 0 0}

.gallery-theme .engagement{ width:42%}

h1 a{ color:#000}

.bnew-gallery{ margin:0 auto 20px; }

.more-gallery>div{width:260px;height:260px; overflow:hidden}
.more-gallery>div .viewfull-gallery{ height:100%}
.more-gallery.bnew-gallery>div{ width:360px; height: 360px; overflow:hidden;}
.more-gallery>div:nth-child(3n){ clear: right }
.more-gallery.bnew-gallery>div.banner-box{ height:250px; }
.more-gallery.bnew-gallery>div.banner-box div{width:300px; height:250px; margin:auto}

.edit-gallery-modal{overflow-x: hidden; overflow-y: auto;}


.cover-clip { position: fixed; width: 100%; display: none; visibility: hidden; height: 100%; top: 0; left: 0; z-index: 999; background: rgba(0,0,0,0.6); }
.cover-clip.open { display: block; visibility: visible; }
.cover-modal { width: 1200px; margin:15px auto; clear: both; position: relative; text-align: center; padding: 20px; background: #000; border-radius: 20px;box-sizing: border-box;}
.close-clip { background: #FFF; display: inline-block; position: absolute; right: 14px; top: 24px; border-radius: 10px; padding: 5px 16px; font-size:18px;}
.close-clip a { color: #000;}
.cover-clip .main-clip iframe{width:800px;height: 450px;}
.cover-clip .cover-modal{margin:100px auto 0;}


.cover-modal{ background:#FFF !important; margin:auto; padding:20px 0; width:1100px; position:relative}

.gallery-wide { width: 100%; border-radius: 0; overflow: hidden;}
.gallery-wide .gallery-top { width: calc(100% - 360px); height: 80vh; display: inline; float: left;}
.gallery-wide .gallery-thumbs { width: calc(100% - 360px); display: inline; float: left;}
.gallery-wide .full-info-gal { width: 320px; display:inline; float: right; margin: 0; padding: 0; }
.gallery-wide .full-info strong { width: 100%; display: block; float: none; padding-top: 10px; }
.gallery-wide .full-info-section { width: 300px; display: block; float: none;}
.gallery-wide .full-info-section .full-article img { width: 100%; height: auto; margin: 0 0 10px;}
.gallery-wide .info-detail-desc { display: block; float: none; width: 100%;}
.gallery-wide .full-info-topic { padding: 0}
.gallery-wide .full-info { border: 0}
.edit-gallery-modal .gallery-top .swiper-slide img { max-height: 80vh!important;}
.gallery-wide .banner { background: #FFF; margin-bottom:20px;}

.gallery-wide .full-info-caption {padding-top: 10px; text-align: left;}
.gallery-wide .full-info-caption a {color: black;}

.gallery-modal.edit-gallery-modal{ padding:0px}
.edit-gallery-modal{ line-height:normal !important}
.edit-gallery-modal .gallery-top { }
.edit-gallery-modal .gallery-top .swiper-slide{ margin:auto; box-sizing:border-box; }
.edit-gallery-modal .gallery-top .swiper-slide img{margin: auto; display: block; width:auto; max-width: 960px!important;}
.edit-gallery-modal .gallery-thumbs .swiper-slide{ width:160px}
.edit-gallery-modal .gallery-thumbs{ height:120px; background: none}
.edit-gallery-modal .swiper-button-next,.edit-gallery-modal .swiper-button-prev{ -webkit-filter: grayscale(1); filter: grayscale(1);}


.swiper-button-next,.swiper-button-prev{ padding:0 20px; height: 100% !important; transform: translate(0,-50%);}



.more-gal-link a{ display:block; background:#22b573; padding:12px 0; text-align:center; font-size:16px; color:#FFF; margin:36px 0 0}

.info-gal-box{ padding:20px; margin:30px auto 0; border-top:1px solid #EEE; overflow:hidden;}
.info-gal-box>h3{  font-family:CS ChatThaiUI;padding:16px; margin:0; font-size:22px; float:left; width:500px; clear: inherit !important; line-height:normal !important}
.info-gal-box>h3 a{ color:#000}
.info-detail-gal-box{ overflow:hidden; padding:8px 16px; float:left; position:relative;}
.info-detail-gal-box>a{ position:absolute; top:0; left:0; width:100%; height:80%;}
.info-detail-gal-box>span{ display:block; float:left; width:260px;}
.info-detail-gal-box>span img{ display:block; width:100%; height: auto; margin:0}
.info-detail-gal-box figcaption{ float:left; width:350px; padding:0 0 0 16px; line-height: normal; text-align:left}
.info-detail-gal-box figcaption>span{ font-size:14px; color:#777; display:block; padding:0 0 8px}
.info-detail-gal-box figcaption h2{  font-family:CS ChatThaiUI;font-size:18px; color:#000; padding:0; line-height: normal; margin: 0;}
.info-detail-gal-box figcaption p{ font-family:CS ChatThaiUI;font-size:14px; color:#666; padding:6px 0 0}

.info-gal-status{ width:100%; border-top:1px solid #eee; padding:8px 0 0; margin:12px 0 0}
.info-gal-status span{ display:inline-block; font-size:14px; margin:0 24px 0 0}
.info-gal-status span i{display:inline-block; width:16px; height:16px; vertical-align: sub; margin:0 6px 0 0}
.info-gal-status span  i img{ width:100%; height:auto; display:block; margin:0 }
.info-gal-status span:first-child{ font-size:13px; color:#999; margin:0 32px 0 0}
.info-gal-status span:first-child i{width:14px; height:14px; -webkit-filter: brightness(1.7); filter: brightness(1.7); margin:0}

.info-gal-tag{ padding:12px 0 0; text-align:center}
.info-gal-tag h3{ display:inline-block; padding:4px 6px; font-size:16px; height:26px; box-sizing:border-box; line-height: normal;margin: 0; clear: both; overflow: inherit;}
.info-gal-tag a{ display:inline-block; padding:4px 6px; font-size:14px; background:#eee; height:26px; box-sizing:border-box; border-radius:3px; line-height: normal; color:#666}

.ad-gal-info{ float:right; width:300px; height:250px; margin:36px 36px 0 0}


.edit-gallery-modal .gallery-close{ top:0; right:30px}
.edit-gallery-modal .gallery-close .ico-close{width: 50px; height: 50px; padding:0}

.gallery-modal-include{ display:block !important; position:static !important; visibility:visible !important; background:none !important; padding:0 !important}
.gallery-modal-include .gallery-close{ display:none}

.gallery-thumbs .swiper-slide img{ width:100%; height:auto; display:block}



@media screen and (max-width : 1200px) {
/*.container{ width:1000px;}*/
.comment-zone .comment{ width:68% !important;}



.cover-modal{ width:calc(100% - 20px)}

.edit-gallery-modal .gallery-top .swiper-slide img{max-height: 480px!important;max-width: 600px!important;}

.info-detail-gal-box figcaption{ width:300px}
.ad-gal-info{margin: 36px 0px 0 0;}
}
@media screen and (max-width : 800px) {
.edit-gallery-modal .gallery-top .swiper-slide img{height: 400px;}

}

.content .open-gallery {  display: block; position:unset;}
.content .open-gallery:hover:after { content:"Open More Picture"; position: absolute; top: 50%; left: 50%; color: #FFF; display: block; background:url(../svg/gallery.svg) rgba(0,0,0,0.5) 30px center no-repeat; background-size: 24px; padding: 20px 40px; text-indent: 40px; transform: translate(-50%,-50%)}    
.content>div {overflow: auto; margin:0;}

.swiper-container { width: 100%; height: 300px; margin-left: auto; margin-right: auto;}
.swiper-slide {}
.swiper-slide iframe { margin: 0 auto; display: block;}
.gallery-top { height: 80%; width: 100%; }
.gallery-thumbs { height: 20%; box-sizing: border-box; padding: 10px 0; background: rgba(0,0,0,0.9); border-radius: 10px; }
.gallery-thumbs .swiper-slide { width:12%; height: 100%; opacity: 0.3; background-size: cover; background-repeat: no-repeat}
.gallery-thumbs .swiper-slide-active { opacity: 1; border:1px solid #FFF;}    
.gallery-modal { position:fixed; height: 100%; top: 0; left: 0; width: 100%; z-index: 999; background: rgba(0,0,0,0.9); box-sizing: border-box; display: none; visibility: hidden;}
.gallery-modal.open { display: block; visibility: visible;}
.swiper-button-white { padding: 20px; background-color: rgba(255,255,255,.05); }
.gallery-close { position: absolute; top: 0; right: 0; z-index: 9999;}
.gallery-close .ico-close { display: block; width:60px; height:60px; background: url("../svg/close.svg") #000 center center no-repeat; background-size:50px; padding:20px;}

.item__banner_close{cursor: pointer;position: absolute;top: 50%;right: -30px;transform: translate(0,-50%);background: url("../svg/close.svg") #000 center center no-repeat;background-size: 16px;width: 20px;height: 20px;display: block;border-radius: 50%;border: #fff 1px solid;}
.item__banner_gallery{background-color:gray;position:absolute;bottom:0;left:50%;transform: translateX(-50%);z-index:99;}