﻿/* =============================================
スマホ改行
============================================= */
.sp-br {
  display: none;
}
.pc-br {
  display: inline;
}
@media screen and (max-width: 768px) {
  .sp-br {
    display: inline;
  }
.pc-br {
  display: none;
  text-align: left;
}
.pc-tex-left {
  text-align: left!important;
}
}
/* =============================================
文字：太さ、下線
============================================= */
.fontbold {
  font-weight: bold;
}
.underline {
  text-decoration: underline;
}
/* =============================================
文字：並び
============================================= */
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.text-left {
  text-align: left;
}
@media screen and (max-width: 768px) {
.sptxt-center,text-right{
    text-align: center;
}
}
/* =============================================
文字：字間
============================================= */
.letter-spacing-01 {
    letter-spacing: -.1rem;
}
/* =============================================
文字：色
============================================= */
.color-white {
  color: #fff;
}
.color-red {
  color: #E37654;
}
.color-red a{
  color: #FF0000;
}
.color-red2 {
  color: #FF0000;
}
.color-red2 a{
  color: #E37654;
}
.color-pink01 {
  color: #FE4297;
}
.color-pink02 {
  color: #E58DB5;
}
.color-green01 {
  color: #60D0A1!important;
}
.color-green01 a {
  color: #60D0A1!important;
}
/* =============================================
文字：サイズ
============================================= */
.font170 {
  font-size: 170%;
}
.font160 {
  font-size: 160%;
}
.font150 {
  font-size: 150%;
}
.font140 {
  font-size: 140%;
}
.font130 {
  font-size: 130%;
}
.font120 {
  font-size: 120%;
}
.font110 {
  font-size: 110%;
}
.font90 {
  font-size: 90%;
}
.font80 {
  font-size: 80%;
}
.font70 {
  font-size: 70%;
}
/* =============================================
幅
============================================= */
.margin-center {
  margin-right: auto!important;
  margin-left: auto!important;
}
.margin-center img {
  margin: 0 auto;
  display: block;
}
.vw100{
  width: 100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}
.w80{
    width: 80%;
}
.w70{
    width: 70%;
}
.w60{
    width: 60%;
}
.w50{
    width: 50%;
}
.w40{
    width: 40%;
}
.w30{
    width: 30%;
}
@media screen and (max-width: 768px) {
  .w80, .w70, .w60, .w50, .w40, .w30{
    width: 90%;
}     
}
/* =============================================
下
============================================= */
.mb140 {
  margin-bottom: 140px;
}
.mb130 {
  margin-bottom: 130px;
}
.mb120 {
  margin-bottom: 120px;
}
.mb110 {
  margin-bottom: 110px;
}
.mb100 {
  margin-bottom: 100px;
}
.mb90 {
  margin-bottom: 90px;
}
.mb80{
margin-bottom: 80px;
}
.mb70{
margin-bottom: 70px;
}
.mb60{
margin-bottom: 60px;
}
.mb50{
margin-bottom: 50px;
}
.mb40{
margin-bottom: 40px;
}
.mb30{
margin-bottom: 30px;
}
.mb20{
margin-bottom: 20px;
}
.mb15{
margin-bottom: 15px;
}
.mb10{
margin-bottom: 10px;
}
/* =============================================
画像ズーム
============================================= */
.zoomhover{
    width: 100%;
    margin:0 auto;
    overflow:hidden;
}
.zoomhover img{
    transition:.5s all;
}
.zoomhover img:hover{
  transform:scale(1.2,1.2);
  transition:.5s all;
}
.zoomhover figure{
    transition:.5s all;
}
.zoomhover figure:hover{
  transform:scale(1.2,1.2);
  transition:.5s all;
}
/* =============================================
Top：
============================================= */
.topnews .dlb_c40_btn{
  margin: 0 auto;
}
.dlb_area_1 .dlb_contact_telnum .in{
  background: none!important;
  padding-left: 0!important;
}
.dlb_c40_box{
  background-color: rgba(0,0,0,0.6);
}
.dlb_subtitle2_08_en {
  text-align: center!important;
}
.dlb_subtitle2_08_jp {
  text-align: center!important;
}
.dlb_box2-8_area .dlb_box2-8_title{
  margin-bottom: 0px!important;
}
.dlb_c64_con a{
  display: block;
  width: 100%;
  height: 100%;
}
.col2_221 a {
  width: calc(50% - 0.5px);
}
.col2_221 a .col {
  width: 100%;
  margin-right: 1px;
  margin-bottom: 1px;
}
.col2_221 a .col:hover {
  opacity: .7;
  transition: all .5s;
}
.col2_221 a:hover {
  text-decoration: none!important; 
}
.btn-green.dlb_btn a{
    background-color: #60D0A1;
    color: #ffffff;
    border-color: #60D0A1;
}
.btn-green.dlb_btn a:hover{
    background-color: #ffffff;
    color: #60D0A1;
    border-color: #60D0A1;
}
.btn-green.dlb_btn a:hover::before{
    border-color: #60D0A1;
}
/* =============================================
下層：
============================================= */
.dlb_content-50-1{
  padding: 40px 0;
}
.dlb_color_base_bg-green {
    background-color: #D5FBE6!important;
    border: #32DCAF 1px solid;
    color: #000000!important;
}
.vw100text{
    margin: 0 auto;
    max-width: 950px;
}
.donation-anc .menu_btn_332 li{
    width: calc(47% - 5.4px);
}
.donation-anc .menu_btn_332{
    justify-content: space-around;
}
.menu_btn_332-green{
    background-color: #60D0A1!important;
    border: #60D0A1 1px solid!important;
    color: #fff!important;
}
.menu_btn_332-green:hover{
    background-color: #fff!important;
    border: #60D0A1 1px solid!important;
    color: #60D0A1!important;
}
.menu_btn_332-green:hover::before{
    color: #60D0A1!important;
}
.menu_btn_332-yellow{
    background-color: #FFD166!important;
    border: #FFD166 1px solid!important;
    color: #fff!important;
}
.menu_btn_332-yellow:hover{
    background-color: #fff!important;
    border: #FCB81A 1px solid!important;
    color: #FCB81A!important;
}
.menu_btn_332-yellow:hover::before{
    color: #FCB81A!important;
}
.dlb_c59_block::before {
    display: none;
}
.dlb_color_base_pseudo_bg-green::before {
    background-color: #60D0A1!important;
}
.dlb_subtitle3_02 {
    padding: 2px 0 2px 0px!important;
    border-style: none!important;
}
.yaritaikoto .dlb_box2-8_txt {
    height: 380px!important;
    width: 510px!important;
}
.member-col .col img{
    box-shadow: 3px 3px 3px #eee;
}
@media only screen and (max-width: 690px){
.yaritaikoto .dlb_box2-8_txt{
    padding: 32px 24px!important;
    height: auto!important;
    position: static!important;
    width: 100%!important;
}
}
.youtube .dlb_box2-3_img {
    float: left;
    width: 50%;
}
.youtube .dlb_box2-3_title, .dlb_box2-3_txt {
    float: right;
    width: calc(100% - 50.5% - 40px)!important;
}
@media screen and (max-width: 690px) {
.dlb_box1-3_area .dlb_box1_txt {
    padding: 24px 20px!important;
}
.youtube .dlb_box2-3_title, .dlb_box2-3_txt {
    float: right!important;
    width: 100%!important;
}
.youtube .dlb_box2-3_img, .youtube .dlb_box2-3_img iframe {
    width: 100%;
}
.vw100text{
    width: 80%;
}
.main_area .main_txt{
    font-size: 80%;
    padding-top: 24%;
}
}
/* =============================================
PULLDOWN MENU 
============================================= */
.mm_inner {
    position: absolute;
    width: 200px;
    left: calc(50% - 100px);
    top: 50px;
    opacity: 0;
    z-index: 10;
    transition: all 0.4s;
    visibility: hidden;
    display: block;
    border: 1px solid #eeeeee;
}

/*.gnavi_area > ul > li.megamenu:hover > ul,*/
.megamenu:hover .mm_inner {
    opacity: 1;
    z-index: 100;
    top: 68px;
    visibility: visible;
}

.mm_inner .mm_in_title {
    width: 25%;
    color: #ffffff;
    background: #0086CA;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: bold;
}

.mm_inner .mm_in_title .en {
    font-size: 10px;
    font-weight: normal;
}

.mm_inner .mm_nav {
    width: 100%;
}

.megamenu {
    position: relative;
}

.megamenu ul {
    display: block !important;
    width: 100%;
    padding: 0;
}

.megamenu li {
    display: inherit;
    width: 100%;
    border-left: none;
    overflow: hidden;
}

.megamenu li+li {
    border-top: 1px solid #eeeeee;
}

.megamenu li:last-child {
    border-right: none;
}

.megamenu li a {
    display: block !important;
    color: #555;
    padding: 8px !important;
    background-color: white;
}

.megamenu li a:hover {
    color: #0086CA;
    background-color: #F3F3F0;
    text-decoration: underline;
}

header.template_c2 .gnavi_area ul .megamenu .mm_inner li a::after {
    display: none;
}

.mm_btn {
    position: absolute;
    display: none;
    width: 30px;
    height: 30px;
    top: 10px;
    right: 10px;
    -webkit-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}

.mm_btn.active {
    transform: rotate(-45deg);
}

.mm_btn::before {
    position: absolute;
    display: block;
    content: '';
    width: 20px;
    height: 2px;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
    background-color: #333;
}

.mm_btn::after {
    position: absolute;
    display: block;
    content: '';
    width: 2px;
    height: 20px;
    top: 50%;
    left: 14px;
    transform: translateY(-50%);
    background-color: #333;
}
.gnavi-li{
    display: none;
}
@media only screen and (max-width:690px) {
    .mm_inner {
        position: static;
        display: none;
        width: 100%;
        opacity: 1;
        visibility: visible;
        border: 0;
        transition: all 0s;
    }

    .megamenu li a {
        display: block !important;
        color: #555;
        padding: 8px 30px !important;
        background-color: white;
    }

    .megamenu li+li {
        border-top: 0;
    }

    .mm_btn {
        display: block;
    }
    .gnavi-li{
    display: block;
}
    .no2{
    padding-top: 0!important;
    }
}

.top_column .dlb_media_cate span {
        font-size:11px;
}
@media only screen and (max-width: 690px){
.menu_btn_332 {
    display: block!important;
}
.menu_btn_332 li, .menu_btn_d332 li {
    width: 100%!important;
    margin-right: 0px;
    margin-bottom: 0px!important;
}
.menu_btn_332 li a {
    height: 48px!important;
}
.btn-2 .mt30 {
    margin-bottom: 15px!important;
    margin-top: 15px;
}
.dlb_btn_w70 {
    max-width: 100%!important;
}
.dlb_btn_w60 {
    max-width: 100%!important;
}
.dlb_btn_w80 {
    max-width: 100%!important;
}
}
/* =============================================
背景画像マウスオーバー（画像とテキストボックスが重なっているもの）
============================================= */
.bgzoom figure{
  overflow: hidden;
}
.bgzoom figure{
  background-image: none!important;
}
.bgzoom figure a img{
  transition:.3s all;
  display: block!important;
  margin-right: 0!important;
  margin-left: 0!important;
}
.bgzoom figure a img:hover{
  transform: scale(1.2);
  transition:.3s all;
  display: block!important;
}
.dlb_box2-8_area .dlb_box2-8_txt {
    z-index: 100;
}
.bgzoom .dlb_box2-8_img {
    width: 880px;
}
@media only screen and (max-width: 945px){
.bgzoom .dlb_box2-8_img {
    width: 100%;
}
}