.moon .main_title {position:relative;}
.moon .type_right { margin:80px 0 0 80px}
.moon .main_title h2 {font-size:44px;}

.moon .navbar  ul.navbar-nav { text-align:right}

section {padding-top:30px;}
section.moon {padding-top:10px;}
section.moon .v_title {position:absolute; bottom:30px; margin-left:40px; text-shadow:0 0 3px #000000;}

.moon .today_title {margin:10px 20px 0 20px;}
.moon .card {width:98%; }
.today .rounded-3 {margin-bottom:0;}

.today .col-lg-5 {width:72%; margin-left:15px;}
	.today .col-lg-5 a {padding-top:7px;}
	.today .col-lg-5 .small {font-size:0.8em;}
.today h2.card-title a.stretched-link {font-size:1.575rem !important;}

.bluehouse { background-color:#1B3FD8; font-size:1rem !important}
.category {margin-top:0px;}
.category h4 {margin-top:-50px;font-size:1rem !important}
.category a {font-size:1rem !important}
.category .bg-dark-overlay-4, .category .bg-dark-overlay-6 {position: relative; z-index: 99;}
.category .bg-dark-overlay-4:before, .category .bg-dark-overlay-6:before {
  content: " "; background: #000; opacity: 0.3 !important; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: -1;
}

.sns-banner { margin:0 0 5px 0;}
.sns-banner i.fs-5 { float:left; margin:2px 0 0 0 !important}
.sns-banner .small {margin:-2px 0;}

main.moon .spilt-fixed { margin-top:-110px; margin-left:0;}
main.moon .spilt-fixed img { width:80%;}
main.moon .card-grid {margin-left:0;}
main.moon .g-4 { margin-bottom:50px;}

main.moon .moon_story { padding:0; }
main.moon h3.moon_story  {margin:40px 0 50px 0;}
main.moon div.txt {margin:30px 15px; font-size:1.1rem}
main.moon .col-md-10 h5 {margin-top:7px; font-size:1rem}
main.moon .moon_story .col-md-10 {width:80%;margin:0 auto;}
main.moon .history  { clear:both; margin:20px 20px 0 20px;}
main.moon .history dd { float:left; padding-right:10px;}
main.moon .history dt { float:left; padding:5px 20px 15px 20px;}
main.moon img.card-img {margin:5px 0 5px 15px;}

@media (min-width: 768px) and (max-width: 991px){
main.moon .history dd { float:left; }
}

@media (max-width: 767px){
main.moon div.txt {width:90%;}
main.moon img.card-img {margin:10px 0;}

main.moon blockquote {padding:50px 10px 0 10px;}
main.moon blockquote p {font-size:1rem;}
main.moon .blockquote-footer {padding-left:10px;}
main.moon .history  { width:100%; }
main.moon .history dd { width:100%; }
main.moon .history dt{ width:90%; padding:0 10px 15px 10px; font-size:1rem; border-bottom:1px solid #EEEEEE;}
}

section.memory .container { margin-top:-20px;}
section.memory .container h1 { padding:18px 0 8px 0;font-size:2rem; text-shadow:0 0 4px #000000;}
section.memory .card h4 {font-size:1.02rem}
section.memory h2 {padding-top:50px; font-size:1.5rem}

section.book .col-12 {margin:-30px 0 40px 0 !important;}
section.book .col-sm-6 { margin-bottom:20px;}
section.book .col-sm-6 h4 { height:60px; }
section.book .text-primary {margin-bottom:0;}
section.book .book-img {height:300px; margin-top:0; background:center center no-repeat;}
section.book .mb-4 a { float:right; margin-top:-20px; }

@media (min-width: 768px) and (max-width: 991px){
section.book .col-2 {width:33%; padding:10px;}
}

@media (max-width: 767px){
section.book h4 { width:120%;margin:0 -10px;font-size:1.1rem; }
section.book .mb-4 a { clear:both; float:left; margin-top:20px;}
section.book .col-2 {width:50%; padding:10px;}
}

section.sub_v { margin-top:-20px; }
section.sub_v h1 {padding:8px 0;font-size:2rem; text-shadow:0 0 4px #000000;}
section.sub_moon h2 {text-shadow:0 0 4px #000000;}
section.sub_v .bg-dark-overlay-4 {width:100%;}

section.sub_v .p-4 {padding:40px 5px 32px 5px !important;}

section.search .mb-4{ font-size:1.2rem }
section.search .badge {padding:9px 10px 7px 10px;}
section.search .bg-primary-soft {margin:-10px 0 30px 0; padding:15px 0 8px 20px;}
section.search .bg-primary-soft a { margin:5px 10px 0 10px;}
section.search h1 {padding-bottom:15px;font-size:1.8rem; text-shadow:0 0 4px #000000;}

.hashtag {margin:15px 0 -30px 0;}
.hashtag a {margin:0 10px 0 10px;}
.msg { padding:30px 0 50px 0; font-size:2rem; color:#000000; text-align:center; }
.search_category h2 {padding-bottom:5px; font-size:1.6rem !important; text-shadow:0 0 4px #000000;}
.search_category .h5 { text-shadow:0 0 4px #000000;}
.search_category a {font-size:1rem !important}
.search_category .h5 {font-size:1rem !important}
.search_category .bg-dark-overlay-4, .category .bg-dark-overlay-6 {position: relative; z-index: 99;}
.search_category .bg-dark-overlay-4:before, .search_category .bg-dark-overlay-6:before {
  content: " "; background: #000; opacity: 0.3 !important; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: -1;
}


.timeline .tab-content {padding-left:20px;background:#f8f9fa;}
.timeline-tab { margin-top:-40px;}
.timeline-tab .nav-tabs  {border:none;}
.timeline-month {}
.timeline-month .input-group {width:480px;}
.timeline-month .input-group label {display:none;}

h1.display-5 { margin-bottom:40px; }

@media (min-width: 768px) and (max-width: 991px){
.timeline-month {}
.timeline-month .input-group {width:580px; }
.timeline-month .input-group select.form-select {font-size:0.8rem;}
}

@media (max-width: 767px){
.timeline-month .input-group { }
.timeline-month  {width:105%; margin-left:-20px;}
}

#btn_more {display:none; width:100%; margin-top:-180px; height:150px; padding-top:150px; text-align:center; background:linear-gradient(180deg, transparent, white); cursor:pointer;}
.photo-tag { text-align:center; margin-bottom:80px; }
.photo-tag .ms-2 { padding-bottom:10px; font-size:1.5rem; font-weight:bold; }
.photo-tag a { margin:0 15px; }

@media (max-width: 767px){
.photo-tag a { font-size:1.2rem; margin:0 5px; }
}

#speech {margin:30px auto 0 auto; overflow:hidden; line-height:200%;}
#speech blockquote { margin:40px 0 20px 0; font-size:1.2rem; position: relative; padding-left: 70px;}
#speech blockquote:before { content: '"'; position: absolute; top: 0;  left: 0; font-size: 7rem; line-height: 0.8em; font-weight: 700; color: #2163e8; }
footer img { width:200px;}
@media (max-width: 767px){
footer .mt-2  {width:100%; margin:-2px 0 0 0 !important;font-size:0.8rem; text-align:center;}
footer img { display:none;}
}

.source-area { width:80%; padding:50px 20px 100px 0; margin:0 auto;}
dl.source dt {padding:10px 0;}
dl.source dd {float:left;width:100%;padding:10px 0 30px 0;font-size:1rem;}
dl.source dd i {margin-right:5px; color:#0a1645;}
	dl.source dd .bi-BH {float:left; width:20px; height:20px; margin:2px 10px 0 0; background-color:#0a1645; background-image:url(../images/logo_BH.png); background-position: center center; background-size: cover;}
	dl.source dd i.bi-instagram {color:#8443a7;}
	dl.source dd i.bi-twitter {color:#1b92e1;}
	dl.source dd i.bi-youtube {color:#ff0000;}
dl.source dd a {display:inline-block; margin-right:20px; font-size:1rem;}  
dl.source p {clear:both;padding:20px 0 0 30px;margin:0;font-size:0.8rem;}
dl.source dd ul li {float:left; list-style:none;}

@media (max-width: 767px){
.source-area { width:90%;}
dl.source dd ul, dl.source dd p {padding-left:10px;}
dl.source dd ul li {padding-bottom:10px;}
}

.chart {margin-bottom:50px;}
	.chart h5 { padding:20px 0 10px 30px;font-size:1.1rem}
.description { padding-left:30px;}
.description i { margin:-5px 5px 0 0; }
.description span {font-size:1.5rem;font-weight:bold; color:#000000; margin:0 10px;}

@media (max-width: 767px){
	.chart h5 { padding:20px 0 10px 15px;font-size:1.1rem}
	li.menu_world { display:block; }
	li.menu_chart { display:none; }
}

.chart .chart-img { position:relative; padding:20px 0;}
.chart .index  {position:absolute; bottom:22px; width:100%; text-align:center;}
.chart .index a {display:inline-block;height:24px;overflow:hidden;text-indent:-30em;cursor:pointer;}
	.chart .index a.rating-1 {width:54px;margin:-2px 16px 0 0;}
	.chart .index a.rating-2 {width:54px;}
	.chart .index a.region-1 {width:50px; margin:0 0 -7px 62px;}
	.chart .index a.region-2 {width:78px; margin:0 0 -7px 0;}
	.chart .index a.region-3 {width:51px; margin:0 0 -7px 0;}
	.chart .index a.region-4 {width:76px; margin:0 0 -7px 0;}
	.chart .index a.region-5 {width:76px; margin:0 0 -7px 0;}
	.chart .index a.region-6 {width:76px; margin:0 0 -7px 0;}
	.chart .index a.region-7 {width:103px; margin:0 0 -7px 0;}
	.chart .index a.region-8 {width:52px; margin:0 0 -7px 0;}
	.chart .index a.age-1 {width:78px; margin:0 2px -7px 25px;}
	.chart .index a.age-2 {width:56px; margin:0 0 -7px 0;}
	.chart .index a.age-3 {width:57px; margin:0 2px -7px 0;}
	.chart .index a.age-4 {width:58px; margin:0 2px -7px 0;}
	.chart .index a.age-5 {width:78px; margin:0 0 -7px 0;}
	.chart .index a.comp-1 {width:71px; margin:0 1px -12px 6px;}
	.chart .index a.comp-2 {width:71px; margin:0 1px -12px 0;}
	.chart .index a.comp-3 {width:71px; margin:0 1px -12px 0;}
	.chart .index a.comp-4 {width:71px; margin:0 1px -12px 0;}
	.chart .index a.comp-5 {width:71px; margin:0 2px -12px 0;}
	.chart .index a.comp-6 {width:71px; margin:0 0 -12px 0;}

.stats { height:210px; padding:10px 30px 0 30px; margin-bottom:30px;}
	.stats .number { font-size:4rem; font-weight:bold; color:#000000;}
	.stats div { text-align:right; font-size:0.9rem;}
	.stats span {font-size:0.8rem;}
.bg-violet-soft {background-color:#fdeef9;}

.timeline .line {padding:0 40px 0 150px; background:url('../images/record/bg_timeline.png') top left repeat-y;}
.timeline .date {padding-bottom:15px; font-size:1.4rem; }
.timeline .thumb {height:150px;background-position:center center; background-size:cover;}
.timeline .icon-timeline {position:absolute; margin-left:-127px; width:123px; height:79px; background:url('../images/record/timeline_on.png');}

@media (max-width: 767px){
.timeline .line {padding:0 10px; background:none;}
.timeline .icon-timeline {display:none;}
}

.table-list {position:relative;}
	.table-list h3 {margin:40px 0 20px 0; font-size:2rem; color:#000000;text-align:center;}
	.table-list .year {float:left;width:15%;margin-top:30px;font-size:3rem; color:#000000;}
	.table-list hr {width:100%; color:#FFFFFF;}
  
dl.world-list {float:right;width:85%; margin-top:40px;border-top:2px solid #212529;}
	dl.world-list dt, dl.world-list dd{float:left;padding:8px 0 8px 8px;border-bottom:1px solid #dee2e6;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
	dl.world-list dt {width:61%;}
	dl.world-list dd {width:15%;}
	dl.world-list dd.space {width:24%;}
	dl.world-list hr {clear:both;display:none;}

dl.country-list {float:left;width:100%;margin-top:0;border-top:2px solid #212529;text-align:left;}
	dl.country-list dt, dl.country-list dd {float:left;padding:8px 0 8px 8px;border-bottom:1px solid #dee2e6;}
	dl.country-list dt {width:83%;}
	dl.country-list dd {clear:both; width:17%;}
	dl.country-list hr {clear:both;float:left;display:none;}
	.d-line  {height:60px;}

.world {width:94%;margin:0 auto;}
.world h3 {margin:40px 0 10px 0;}
.explain { padding:20px; line-height:200%;}
	.explain p { padding-top:20px; font-weight:bold;color:#000000;}
	.explain .key {font-size:1.2rem;font-weight:normal;}
	.explain span {font-size:0.8rem;font-weight:normal;}
	.explain .blockquote:before  {color:#d6293e}
	.explain blockquote p {font-weight:normal;}


.counrtry-map .tab-content {float:left; width:100%;}
.tab-pane .map { float:left; width:50%; height:500px; background-position:center center; background-size:contain; background-repeat:no-repeat;}
.detail {float:right; }
  .country-detail::-webkit-scrollbar {
    width:12px;
  }
  .country-detail::-webkit-scrollbar-thumb {
    background-color: #C4C6C9;
    border-radius:12px;
    background-clip: padding-box;
    border: 2px solid transparent;
  }
  .country-detail::-webkit-scrollbar-track {
    background-color: #f5f5f5;
    border-radius:12px;
    box-shadow: inset 0px 0px 5px white;
  }
	.detail table {margin-top:10px;border-top:2px solid #696A6A;text-align:left; width:97%;}
	.detail h3 {text-align:left;font-size:1.2rem;}
	#country {margin-top:-15px;}
.country-area {position:relative; margin-top:-10px;}

.tab-pane .navbar-nav-scroll {position:absolute; right:0; margin-top:20px; width:300px; height:400px; font-size:1rem;}
	.tab-pane .navbar-nav-scroll a.dropdown-toggle {float:right; margin:0 0 0 150px; padding:10px 15px 7px 15px; text-align:left; border:1px solid #ECE9E9; font-size:0.9rem;}
.country-menu {margin-left:-100px; height:300px;overflow:auto;}
	.counrtry-map .dropdown-menu {width:200px; }
  .country-menu::-webkit-scrollbar {
    width:12px;
  }
  .country-menu::-webkit-scrollbar-thumb {
    background-color: #C4C6C9;
    border-radius:12px;
    background-clip: padding-box;
    border: 2px solid transparent;
  }
  .country-menu::-webkit-scrollbar-track {
    background-color: #f5f5f5;
    border-radius:12px;
    box-shadow: inset 0px 0px 5px white;
  }
 
 

@media (min-width:992px) and (max-width: 1196px){
	dl.world-list , dl.country-list {font-size:0.9rem;}
	dl.country-list dt, dl.country-list dd {width:100%;padding:2px 02px 3px;border:none;}
	dl.country-list dt {padding:0 0 6px 3px; border-bottom:1px solid #dee2e6;}
	
	.d-line  {height:auto;}
}
@media (min-width: 768px) and (max-width: 991px){
	.table-list .year { width:100%; }
	dl.world-list {width:100%;margin-bottom:-10px;}
	dl.world-list dt {width:73%;}
	dl.world-list dd {width:100%;padding:8px 0 0 8px;border:none;}
	dl.world-list dd.space {width:27%;padding:8px 0 8px 8px;border-bottom:1px solid #dee2e6;}
	
.tab-pane .map { width:100%; height:500px; margin-top:70px;background-size:contain; }
.detail {clear:both; width:100%;}
	dl.country-list {float:left;width:100%;font-size:0.8rem;margin-bottom:-10px;}
	dl.country-list {font-size:0.8rem;margin-bottom:-10px;}
	dl.country-list dt, dl.country-list dd {width:100%;padding:2px 02px 3px;border:none;}
	dl.country-list dt {padding:0 0 6px 3px; border-bottom:1px solid #dee2e6;}
	
	.d-line  {height:auto;}
}

@media (max-width: 767px){
.map-world {float:left;height:150px; margin-top:-270px; }

.table-list h3 { font-size:1.5rem;}
.table-list .year  {font-size:1.5rem; margin:20px 0 -30px 0;} 
.table-list {padding:0 5px;}
	.table-list .year { width:100%; }
	dl.world-list {width:100%;font-size:0.8rem;margin-bottom:-10px;}
	dl.world-list dt, dl.world-list dd{width:100%;padding:2px 0 2px 3px;border:none;}
	dl.world-list dd.space {width:100%;font-size:0.7rem;border-bottom:1px solid #dee2e6;}

.tab-pane .map { width:100%; height:300px; margin:-200px 0 0 5px;background-size:contain; }
.detail {clear:both; width:100%;}
	.detail h3 {font-size:1.2rem; margin:20px 0 10px 10px;}
.country-detail {height:auto;padding:0 10px;overflow:none; }
	dl.country-list {float:left;width:100%;font-size:0.8rem;margin-bottom:-10px;}
	dl.country-list dt, dl.country-list dd {width:100%;padding:2px 02px 3px;border:none;}
	dl.country-list dt {padding:0 0 6px 3px; border-bottom:1px solid #dee2e6;}
	.d-line  {height:auto;}

ul.nav-tabs {margin-top:-50px;}
ul.continent-menu {margin-left:0; height:300px;overflow:auto;font-size:0.8rem; overflow:hidden;}
	ul.continent-menu li {float:left;padding:0; margin:0 -17px;}

.explain blockquote {padding:30px 0 0 0;}
.explain blockquote p {font-size:1rem;}
.explain .blockquote-footer {padding-left:0;}
}

.team-mail {width:93%;padding:20px;margin:-30px auto 40px auto;}

.text-center.h5.mb-4 {display:block; margin:30px 0;}

/*Letter*/
.letter-title  {margin-bottom:30px; padding-bottom:15px; border-bottom:2px solid #EEEEEE;}
.letter-title h2 {padding:10px 0;}
.letter-title ul {margin-left:5px;}
.letter-view { padding:20px 20px 50px 20px; border-bottom:1px solid #EEEEEE;}
form .form-label {float:left; width:100%; margin-top:5px;}
input#con-name { float:left;width:75%; margin-bottom:20px;}
input#con-password { float:right; width:23%; margin-bottom:20px; }

.L-password {display:block; margin:-200px 0 0 0; padding:60px 30px 30px 30px; border:1px solid #2163E8;position:relative;}
 .L-password .close { position:absolute; top:15px; right:30px; cursor:pointer;}
 .L-password p {height:40px; vertical-align:middle; text-align:center;}
 .L-password .form-control {float:left; width:230px;margin-right:15px;}

@media (max-width: 767px){
input#con-name, input#con-password {width:100%;}
}