/*
Theme Name: charanpo2025theme
Version: 1.1
Template: one-page-express
*/

@import url(css/discography.css);
@import url(css/contact.css);
@import url(css/responsive.css);

@font-face{
    font-family: "Krungthep";
    src: url(./font/Krungthep.ttf) format("truetype");
}

/* ■■■■■■■■■■■■■■■■ common ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
/*body.home #page{*/
html body{
    background-image:url(./img/common/bg1.svg);
    background-position: center top -3rem;
/*    background-size: 100% 100%;
    background-repeat: no-repeat;*/
    /*background-size: contain;*/
    /*background-size: cover;*/
    /*background-size: 100% auto;*/
    background-size: 100% auto;
    background-repeat: repeat-y;
}

html body#charanpo2025.catBody_NEWS,
html body#charanpo2025.category-news{
    background-image:url(./img/common/bg2.svg);
}
html body#charanpo2025.catBody_SCHEDULE,
html body#charanpo2025.category-schedule{
    background-image:url(./img/common/bg3.svg);
}
html body#charanpo2025.profile{
    background-image:url(./img/common/bg4.svg);
}
html body#charanpo2025.contact,
html body#charanpo2025.discography{
    background-image:url(./img/common/bg5.svg);
}

html body#charanpo2025 h2,
html body#charanpo2025 h3,
html body#charanpo2025 h4,
html body#charanpo2025 h5{
    color: inherit;
}

.gridContainer{
      font-family: "Zen Maru Gothic", serif;
}

div#page div.header-wrapper div.plum_plate,
div#page div.header-wrapper div.new_life,
div#page div.header-wrapper div.ripe_malinka,
div#page div.header-wrapper div.sunny_morning{
    background-color: transparent;
    background-image: none;
}

div.header-top + div#page{
    padding-top: 12rem;
}

div#page-content.content .post-content-single,
div#page-content.content,
div#page div#page-content,
div#page,
.archive div#page  .header-wrapper,
.page div#page  .header-wrapper{
    background-color: transparent;
    box-shadow: none;
}

html body div.footer {
    background-color: transparent;
    border:none;
}

#charanpo2025 div.menu-footer_menu-container a{
    text-decoration: none;
}

#charanpo2025 .navigation-wrapper {
    flex-wrap: wrap;
}
#charanpo2025 div.logo_col{
        width: 100vw;
    text-align: center;
    flex: 0 0 100%;
    padding: 3rem 0 1rem 0;
    margin: auto;
}
#charanpo2025 .main_menu_col{
    flex: 0 0 100%;
    
}

#charanpo_footer p,
.singlePostDate,
.news_date,
h1.heading8,
#charanpo2025 #menu-footer_menu,
#charanpo2025 #charanpo_footer,
#charanpo2025 .main_menu_col{
    font-family: "Krungthep";
}


#charanpo2025 #drop_mainmenu { text-align: center; }
#charanpo2025 #charanpo_footer a:hover,
#charanpo2025 div#menu-footer_menu  li a:hover,
#charanpo2025 .main_menu_col li.current-menu-item  a,
#charanpo2025 #drop_mainmenu > li > a:hover{ color: yellow; border:none; }

#charanpo2025 #charanpo_footer  li > a,
#charanpo2025 #drop_mainmenu > li > a{
    padding: 1rem 0;
    /*font-size: 2rem;*/
    font-size: 1.8rem;
    letter-spacing: -1px;
    animation: motion-x 100ms infinite forwards ease;
}

#charanpo2025 div.gridContainer  div#darkBg,
#charanpo2025 div.gridContainer > div.page{
    /*background-color: rgba(0,0,0,0.34);*/
    background-color: rgba(0,0,0,0.50);
    padding: 2rem;
    color: white;
    /*font-size: calc(0.5rem + 0.5vw);*/
    font-size: 0.88rem;
}

#charanpo2025 #charanpo_footer ul{
    display: flex;
    width: 100%;
    /*padding: 2rem 0;*/
    padding: 0 0 1rem 0;
    margin: auto;
    flex-wrap: nowrap;
    align-items:  center;
    text-align: center;
}
#charanpo2025 #charanpo_footer li{
    list-style-type: none;
    margin: auto;
}

#charanpo2025 h3.news-title a,
#charanpo2025 #charanpo_footer a{
    color: white;
}

div#page div.header.color-overlay{
    padding: 0;
}


/*.blog .content > .gridContainer > .row, */
#charanpo2025.archive .content > .gridContainer > .row,
#charanpo2025.single .content > .gridContainer > .row,
#charanpo2025.single-post .content > .gridContainer > .row,
body.archive.category .noTopMargin,
#charanpo2025 .blog .content > .gridContainer > .row, 
#charanpo2025 .archive .content > .gridContainer > .row, 
#charanpo2025 .single-post .content > .gridContainer > .row{
    margin-top: auto !important;
}

#charanpo2025 div.post-list, 
#charanpo2025 .post-item{
    float: none;
    width: 100%;
}

h1.heading8{
    color: yellow;
    text-align: center;
}

ul#ch_breadClumb ul{
    list-style: none;
    max-width: 1232px;
        color: white;

  }
ul#ch_breadClumb  li{      color: white;  display: inline;  }
ul#ch_breadClumb  li a{
    color: inherit;
    text-decoration: none;
    color: white;
  }
ul#ch_breadClumb  li + li:before{
    content: ">";
    margin:.5em;
  }
    


#charanpo2025 div.post-content-inner,
#charanpo2025 div.post-list-item_chrp{
    margin: auto 10rem;
}

#charanpo2025 div.post-list-item_chrp+div.post-list-item_chrp{
    border-top: 1px solid #eee;
}

/* caterogy --------*/
.newsDetail a.button.small.blue{
    border-radius: 2rem;
    margin: 0.5rem auto;
    background-color: white;
    color: #FF00FF;
}
/* //caterogy-------- */

  /*tags*/
  #charanpo2025 #topTagCloud{ border-bottom: none; padding-bottom: 0; }
  #charanpo2025 #topTagCloud a{
      font-weight: bold;
font-size: 0.8rem !important;
    margin-bottom: 0.5rem;
    margin-top: auto;
    display: inline-block;
  }
 
  a.tag-cloud-link:hover{
      text-decoration: none;
      background-color: white;
      color: #ff00ff;
  }
  
  .discography-item__label .label,
  p.label{ width: fit-content; display: inline-block; }
  
  p.discoTag,
  a.tag-cloud-link{
    transition: all 0.2s ease; 
      text-decoration: none;
      margin: auto 1rem 0.5rem auto;
      border:1px solid #ccc;
      padding: 0.25rem 0.5rem;
      font-size: 0.8rem;
      color: white;
      border-radius: 2rem;
  }
  /*tags*/
  
  #charanpo2025 .fm2_drop_mainmenu_mobile-overlay *,
  #charanpo2025 .fm2_drop_mainmenu_mobile-overlay {
/*  background: rgba(0, 0, 0, 0.7) none repeat top left scroll;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
display: inline;
  z-index: 10050;
  position: fixed !important;*/
  transition: all 0.0000s;
  
}
#drop_mainmenu > li.current-page-ancestor > a{
    color: yellow; 
}
@media only screen and (max-width: 768px) {
		#butaGamePC{ display:none; }
}
@media only screen and (min-width: 768px) {
    .pcHide,
    html #charanpo2025 #footSpMenu,
    #openMobMenu{
        display: none !important;
    }
}
@media only screen and (max-width: 1280px) {
    #charanpo2025 #menu-footer_menu li >a{
        font-size: calc(1.25rem + 0.33vw);
    }
}
#charanpo2025 a>img{ text-decoration: none;  }
#butaGameSP{
	width: 12%;
    margin: auto 0 auto auto;
    display: block;
    text-align: right;
}
/* ■■■■■■■■■■■■■■■■ // common ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */



/*================= front ==================================*/
div#page-content div.gridContainer.home{
    padding-left: 0;
    padding-right: 0;
}
div#page-content div.gridContainer.home h1.heading8{ display: none; }

/*================= //front ==================================*/


/*================= news ==================================*/

#charanpo2025 h3.news-title a:hover{
    text-decoration: none;
}
#charanpo2025 h3.news-title{ 
    line-height: 1.25;
    display: inline-flex;
    width: 100%;
    font-weight: bold;
    margin-top: 0.5rem;
    
}
#charanpo2025 h3.news-title a:hover{ color: yellow; }
#charanpo2025 h3.news-title a{
    /*font-size: 1.5rem;*/
    font-size: 1.2rem;
    cursor: pointer;
    line-height: 1.25;
    font-weight: bold;

}

.chrp_post_row{
    padding: 1.5rem 0 0.75rem 0;
}

.news_date{
    font-size: 1rem;
}

.news-title{
    
}
.postTagMark a{
mix-blend-mode: difference;
    color: #99ff2d;
    pointer-events: none;
    cursor: initial;
    font-weight: bold;
}
.postTagMark{
    background-color: white;
    font-size: 0.78rem;
    padding: 0.1rem 0.5rem;
    border-radius: 1.5rem;
    margin-left: 1rem;
    vertical-align: bottom;
    /*mix-blend-mode: difference;*/
    /*color: #00f;*/
}
/*================= // news ==================================*/
/*news_and_other_nav*/
div.numbers-navigation a{ padding-left:  0.8rem; padding-right:  0.8rem;  }
div.numbers-navigation span,
div.numbers-navigation a{
    vertical-align: middle;
    transition-duration: 0.1s;
    font-weight: bold;
}
div.nav-links div.numbers-navigation a:hover.page-numbers{ color: #00f; }
div.nav-links div.numbers-navigation a.page-numbers{ color: #fff; }
div.numbers-navigation span.page-numbers.current{
    /*background-color: transparent;*/
    background-color: white;
    color: #005;
    border:1px solid #fff;
    width: 33px;
    height: 34px;
}
div.numbers-navigation  a.page-numbers:hover {
    /*transition: all 0.2s ease-out 0s;*/
    background-color: #ffffff;
    border-radius: 3rem;
    padding: 0.25rem 0.8rem;
}
.post-list .prev-navigation a, .post-list .next-navigation a {
    box-shadow: none;
    -webkit-box-shadow:none;
    background-color: transparent;
    border-color: transparent;
    padding-left: 0;
    padding-right: 0;
}
#olderLink:hover img,
#newerLink:hover img{ margin-top: -2px; }
#olderLink img,
#newerLink img{
    width: 4rem;
    /*transition: all 0.2s ease-out 0s;*/
}
#olderLink,
#newerLink{
    padding: 0;
    margin: auto;
}
.post-list .prev-navigation a:hover,
.post-list .next-navigation a:hover{
    background-color: transparent;
    box-shadow: none;
    -webkit-box-shadow:none;
}
/*================= // news ==================================*/

/*=================  singlePage==================================*/
#charanpo2025 div.post-content-inner:last-child{ border: none; }
#charanpo2025 div.post-content-inner2 #singleBack a,
#charanpo2025 div.post-content-inner #singleBack a{ color: white; }
#charanpo2025 div.post-content-inner2 #singleBack,
#charanpo2025 div.post-content-inner #singleBack{
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    text-align: right;
    width: 100%;
    margin-top: 1rem;
}

#charanpo2025 div.post-content-inner2,
#charanpo2025 div.post-content-inner{
    position: relative; 
    font-family: "Zen Maru Gothic", serif;
    font-size: 1rem;
    /*line-height: 1.2;*/
    padding-bottom: 3rem;
}
#charanpo2025 .single-post-header{
    text-align: left;
}
.singlePostDate{
    font-size: 1.5rem;
    text-align: left;
    color: white;
}
div.singlePostTags span{
    display: inline-block;
    margin: auto auto 1rem auto;
    padding: 0.25rem 1rem;
    font-size: 0.85rem;
    background-color: white;
    border-radius: 2rem;
    font-weight: bold;
    width: auto;
}
.postTag a{
    color: #FF00FF;
    font-weight: bold;
}

div.gridContainer div.nav-links{
    
}
div#postBottomLinks{
    clear: both;
    margin: 2rem auto 1rem auto;
}

div#postBottomLinks a{
    margin: auto;
    border: 1px solid white;
    background-color: transparent;
    color: white;
    padding-left: 1rem;
    padding-right: 1rem;
}

/*=================  //singlePage==================================*/

#charanpo2025.single-post .headingSingleCont{
    padding-top: 15px;
}

#charanpo2025.single-post div.post-item{
        padding: 0 0 0 0;
}

#charanpo2025 div.post-content-single{
    margin: auto;
    padding: 0;
}


/*=================  contact ==================================*/
#contactAddressWrap{
    width: 82%;
}

#contactAddress{
    display: flex;
    font-family: "Krungthep";
    flex-wrap:  nowrap;
    font-size: 0.9rem;
}
#contactAddress .w50{
    flex: 0 0 50%;
    padding: 0 1rem 1rem 1rem;
}
input.wpcf7-submit, #cf7-area input[type=”submit”]{     transition: all 0.2s ease;  }
input.wpcf7-submit:hover, #cf7-area input[type=”submit”]:hover{
        background-color: #ff00e9;
        color: white;
        
}
#officeAddress{
  font-size: 1.05rem;  
}


/*=================  footer==================================*/
#charanpo2025 #menu-footer_menu ul.sub-menu li.menu-item{
    padding: 0 1rem;
    margin: auto;
    line-height: 1.25;
    height: auto;
}

#charanpo2025 #menu-footer_menu ul.sub-menu li.menu-item a{
    font-size: 1rem;
    margin: auto;
    padding: 0.25rem 0;
}
/*#charanpo2025 #drop_mainmenu > li > a{*/

#menu-footer_menu.menu > li#menu-item-42.menu-item:hover > a,
#menu-footer_menu.menu > li#menu-item-41.menu-item:hover > a{
    top:-180%;
    /*position: absolute;*/
    position: relative;
    opacity: 0.1;
}
#menu-footer_menu > li#menu-item-42.menu-item:hover  ul.sub-menu,
#menu-footer_menu > li#menu-item-41.menu-item:hover  ul.sub-menu{
    top:0;
}
#menu-footer_menu{
    overflow: hidden;    
}

#menu-footer_menu ul.sub-menu{
    flex-direction: column;
    width: 100%;
    transition: all 0.2s ease; 
    position: absolute;
    top:120%;
    left: 0;
}

#menu-footer_menu > li.menu-item{
    position: relative;
    width: 100%;
    transition: all 0.2s ease; 

}

#menu-footer_menu > li >a{
    transition: all 0.2s ease; 
}
#menu-footer_menu > li{
    max-height: 4.0rem;
/*    overflow: hidden;*/
    overflow: visible;
    padding: 1rem 0;
    line-height: 3rem;
    transition: all 0.2s ease; 
}
#charanpo2025 p.footer-copyright{ padding-bottom: 2rem; }

#butaGamePC img{
	max-height:4rem;
}
#butaGamePC{
	position:absolute;
	right:0;
	top:4rem;
}
#footMwnuWrap{
	position:relative;
}
#sns_logo_youtube img{ padding-bottom:3px; }
/*=================  //footer ==================================*/
@media screen and (min-width: 768px){
	#charanpo2025 #charanpo_footer #menu-item-46 a{ padding-left:1.5rem; }
}
@media screen and (min-width: 1180px){
	#charanpo2025 #charanpo_footer #menu-item-45 a{ padding-left:0.5rem; }
	#charanpo2025 #charanpo_footer #menu-item-46 a{ padding-left:3rem; }

}
@media screen and (max-width: 1380px){
/* 	#menu-item-45 span,
	#menu-item-46 span{ display:none; } */
}

.discography-item+p{ display:none; }