@charset "utf-8";

*:where(:not(iframe, canvas, img, svg, video):not(svg *, symbol *)){
all:unset;display:revert}
*,*::before,*::after{box-sizing:border-box;font-style:normal}
a,button{cursor:revert}
ol,ul,menu{list-style:none}
main img{width: 100%; height: auto;}
table{border-collapse:collapse}
textarea{white-space:revert}
meter{-webkit-appearance:revert;appearance:revert}
::placeholder{color:unset}
:where([hidden]){display:none}
:where([contenteditable]){-moz-user-modify:read-write;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space}
:where([draggable="true"]){-webkit-user-drag:element}
ul,dl,ol,li,dt,dd{margin:0;padding:0}

html{font-size:62.5%;line-height:1.7;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;word-break:break-all;font-feature-settings:"palt"; scroll-behavior: smooth;/**/}

#trancelate img,
.head-search-inner img,
.gsc-search-box img{width: auto; height: auto;}

/*
@supports (font-size: clamp(1rem, 1vw, 1rem)) {
  :root {
    --font-size-xs: clamp(1rem, 0vw + 1.1rem, 1rem);
    --font-size-s: clamp(1.3rem, 0.1vw + 1.2rem, 1.3rem);
    --font-size-m: clamp(1.5rem, 0.2vw + 1.4rem, 1.6rem);
    --font-size-l: clamp(1.8rem, 0.4vw + 1.6rem, 2rem);
    --font-size-xl: clamp(2.2rem, 0.7vw + 1.8rem, 2.5rem);
    --font-size-xxl: clamp(2.6rem, 1.2vw + 2rem, 3.1rem);
    --font-size-xxxl: clamp(3.1rem, 1.7vw + 2.2rem, 3.9rem);
  }
}

@supports not (font-size: clamp(1rem, 1vw, 1rem)) {
  :root {
    --font-size-xs: 1rem;
    --font-size-s: 1.3rem;
    --font-size-m: 1.5rem;
    --font-size-l: 1.8rem;
    --font-size-xl: 2.2rem;
    --font-size-xxl: 2.6rem;
    --font-size-xxxl: 3.1rem;
  }
  @media screen and (min-width: 1000px) {
    :root {
      --font-size-xs: 1rem;
      --font-size-s: 1.3rem;
      --font-size-m: 1.6rem;
      --font-size-l: 2rem;
      --font-size-xl: 2.5rem;
      --font-size-xxl: 3.1rem;
      --font-size-xxxl: 3.9rem;
    }
  }
}

.font-size-xs{ font-size: var(--font-size-xs);}
.font-size-s{ font-size: var(--font-size-s);}
.font-size-m{ font-size: var(--font-size-m);}
.font-size-l{ font-size: var(--font-size-l);}
.font-size-xl{ font-size: var(--font-size-xl);}
.font-size-xxl{ font-size: var(--font-size-xxl);}
.font-size-xxxl{ font-size: var(--font-size-xxxl);}
*/


@supports (font-size: clamp(1rem, 1vw, 1rem)) {
  :root {
    --font-size-xs: clamp(1rem, 0vw + 1.1rem, 1rem);
    --font-size-s: clamp(1.3rem, 0.1vw + 1.2rem, 1.4rem);
    --font-size-m: clamp(1.6rem, 0.3vw + 1.4rem, 1.7rem);
    --font-size-l: clamp(1.8rem, 0.5vw + 1.6rem, 2rem);
    --font-size-xl: clamp(2.2rem, 0.7vw + 1.8rem, 2.5rem);
    --font-size-xxl: clamp(2.7rem, 1.1vw + 2.1rem, 3.2rem);
    --font-size-xxxl: clamp(3.2rem, 1.6vw + 2.3rem, 3.9rem);
  }
}

@supports not (font-size: clamp(1rem, 1vw, 1rem)) {
  :root {
    --font-size-xs: 1rem;
    --font-size-s: 1.3rem;
    --font-size-m: 1.6rem;
    --font-size-l: 1.8rem;
    --font-size-xl: 2.2rem;
    --font-size-xxl: 2.7rem;
    --font-size-xxxl: 3.2rem;
  }
  @media screen and (min-width: 1000px) {
    :root {
      --font-size-xs: 1rem;
      --font-size-s: 1.4rem;
      --font-size-m: 1.7rem;
      --font-size-l: 2rem;
      --font-size-xl: 2.5rem;
      --font-size-xxl: 3.2rem;
      --font-size-xxxl: 3.9rem;
    }
  }
}

.font-size-xs{ font-size: var(--font-size-xs);}
.font-size-s{ font-size: var(--font-size-s);}
.font-size-m{ font-size: var(--font-size-m);}
.font-size-l{ font-size: var(--font-size-l);}
.font-size-xl{ font-size: var(--font-size-xl);}
.font-size-xxl{ font-size: var(--font-size-xxl);}
.font-size-xxxl{ font-size: var(--font-size-xxxl);}

body{
  margin:0;
  padding:0;
  background-color:#fff;
  color:#333;
  font-size: var(--font-size-m);
  font-family: Meiryo,-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,sans-serif;
  font-weight:400;
  line-height: 1.7;
}

strong{ font-weight:600;}

a,area,button,input,label,select,summary,textarea,
[tabindex] {
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

a {
  color: #00aeef;
  text-decoration: none;
  cursor: pointer;
}

a:visited,
a:hover,
a:focus,
a:active { color: #00aeef;}

@media (hover: hover) {
a { transition: all .5s ease;}
a:hover { opacity: 0.8;}
}/* End hover */

.serif{
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  font-display: swap;
  font-weight: 500;
}

.en-sans-serif{
  font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  font-display: swap;
  font-weight: 400;
}


.wrap{
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
  display: block;

  /*  contain: paint;
  overflow: hidden;
  */
}

.wrap rt { font-size: 50%; }

/*** HEADER ***/

#HEADER .head-logo{
  position: absolute;
  top: 5rem;
  left: 1rem;
  width: 21.5rem;
  height: 8rem;
  z-index: 1000;
  fill:#00aeef;
}

.header-inner{
  width: 100%;
  height: 4rem;
  background-color: #fff;
}

.header-inner .support-menu{
  margin: 0 auto;
  width: calc(100% - 2rem);
  height: 4rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#HEADER .svg-icon{ fill:#00aeef;}
#HEADER .header-inner .svg-icon{
  margin: 0 0.5rem 0 0;
  padding: 0;
  width: 2.2rem;
  height: 2.2rem;
  display: block;
}

/* NEWS icon */
#HEADER .news-anchor{
  position: relative;
  margin: 0;
  padding: 0;
  width: 4rem;
  height: 4rem;
  display: block;
}

#HEADER .news-anchor .svg-icon{
  position: absolute;
  top: 0.8rem;
  left: 0.5rem;
  margin: 0;
  padding: 0;
  width: 3rem;
  height: 3rem;
  display: block;
  z-index: 10;
}

#HEADER .news-anchor.news-on .svg-icon{ fill:#00aeef;}
#HEADER .news-anchor.news-off .svg-icon{ fill:#999;}

#HEADER .news-anchor .number{
  position: absolute;
  top: 0.3rem;
  right: -0.4rem;
  margin: 0;
  padding: 0;
  width: 1.6rem;
  height: 1.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #c00;
  border-radius: 2em;
  color: #fff;
  font-size: 1rem;
  animation: swing 4s ease-in-out infinite;
  z-index: 20;
}

#HEADER .news-anchor.news-off .number{ display: none;}

@keyframes swing {
  0% { top: 0.3rem; transform: scale(1, 1);}
  3% { top: 0.5rem; transform: scale(1.1, 0.8);}
  10% { top: -1em; transform: scale(1,1);}
  20% { top: 0.3rem; transform: scale(1,1);}
  23% { top: 0.5rem; transform: scale(1.15, 0.8);}
  28% { top: 0.3rem; transform: scale(1,1);}
  100% { top: 0.3rem; transform: scale(1, 1);}
}



/* HEAD support */

.header-support-trigger{
  margin: 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: var(--font-size-m);
  letter-spacing: 0.05em;
  line-height: 1.5;
  cursor: pointer;
}

.header-support-trigger .svg-icon.accessibility{
  transform: rotate( -45deg );
  transition: 0.3s ease-in-out;
}

/* accordion */


.accordion-trigger {
  position: relative;
  padding: 1em 1em 1em 3rem;
  display: block;
  cursor: pointer;
}

.accordion-trigger::before,
.accordion-trigger::after {
  position: absolute;
  top: 48%;
  left: 0;
  width: 1.8rem;
  height: 0.2rem;
  background-color: #00aeef;  
  transition: all 0.4s ease;
  content: "";
  z-index: 10;
}

.accordion-trigger::before { transform: translateY(-50%) rotate(90deg);top: 50%;}
.accordion-trigger.active::before { transform: rotate(180deg);}
.accordion-trigger.active::after { opacity: 0;}

/*
.accordion-trigger::before {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  padding: 0;
  width: 3rem;
  height: 3rem;
  border-radius: 2em;
  background-color: antiquewhite;

  display: block;
  content: "";
}
.accordion-trigger span { position: relative;}
.accordion-trigger span::before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  padding: 0;
  width: 0.1rem;
  height: 3rem;
  background-color: #333;

  display: block;
  content: "";
}
*/
.accordion {
  padding-bottom: 0;
  height: 0;  
  line-height: 0;
  transition: all 0.2s ease;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;

}

.accordion.open {
  padding-bottom: 0;
  height: auto;
  line-height: 1.5;
  pointer-events: all;
  opacity: 1;

}

.support-menu .support-accordion {
  position: absolute;
  top: 4rem;
  left: 0;
  margin: 0;
  padding: 2em 2rem;
  width: 100%;
  height: 0;
  max-height: 0;
  border: solid 1rem #eee;
  background-color: #fff;  
  overflow: hidden;
  transition: all 0.5s ease-in-out;
  opacity: 0;  
}

.support-menu .support-trigger[accordion-open=true] .svg-icon.accessibility{ transform: rotate( 90deg );}
.support-menu .support-trigger[accordion-open=true] + .support-accordion {
  height: auto;
  max-height: 100rem;
  transition: all 0.3s ease-in-out;
  z-index: 1000;
  opacity: 1;
}


/* FIXED HEADER */

#FIXED-HEADER {
  position: fixed;
  top: 5rem;  
  right: 0;
  width: 12rem;
  height: 4.4rem;
  transition: all 0.5s ease;
  z-index: 1000;
}
#FIXED-HEADER.is-hide { top: -10em;}


/* GLOBAL MENU */

.global-search-trigger{
  position: absolute;
  right: 6.4rem;
  top: 0;
  margin: 0;
  padding: 0.3rem;
  width: 4.4rem;
  height: 4.4rem;
  display: block;
  cursor: pointer;
}
.global-menu-trigger{
  position: absolute;
  right: 1rem;
  top: 0;
  margin: 0;
  padding: 0;
  width: 4.4rem;
  height: 4.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  cursor: pointer;
  opacity: 1;
  z-index: 999;
}

.global-menu-trigger strong{ display: none;}

.global-menu-trigger em{
  position: relative;
  margin: -0.1rem 0 0;
  padding: 0;
  width: 3rem;
  height: 0.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #00aeef;
  cursor:pointer;
  outline: 0;
}

.global-menu-trigger em:before,
.global-menu-trigger em:after {  
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #00aeef;
  /*transition: .2s;*/
  content: "";
}

.global-menu-trigger em:before { transform: translateY(-0.9rem);}
.global-menu-trigger em:after { transform: translateY(0.9rem);}


.global-menu-body,
.global-search-body{
  position: fixed;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100vh;
  /*
  height: 100svh;
  */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  transition: all 0.5s ease;
  backdrop-filter: blur(0.7rem);  
  -webkit-backdrop-filter: blur(0.7rem);
  background: rgb(0,0,0, 0.2);
  transform: scale(1.3, 1.3);
  z-index: -999;
  pointer-events: none;
  opacity: 0;
}



/* PAGE TOP */
.page-top{ opacity: 0;}

/* charity-banner */

.charity-banner{
  position: sticky;
  position: -webkit-sticky;
  bottom: 0;
  margin: -2.5rem 0 0;
  padding: 0;
  width: 100%;
  height: 8rem;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  z-index: 999;
  transition: all .5s ease;
  opacity: 0;
  pointer-events: none;
  contain: paint;
}

.scroll-on .charity-banner{ opacity: 1; pointer-events: all;}

/*** CONTENTS ***/


.contents-main-title{
  position: relative;
  margin: 3em auto 0;
  padding: 2em;
  width: 94%;
  max-width: 100rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #f1f1f1;
  z-index: 100;
}

.contents-main-title::before{
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  width: 1.5em;
  height: 1.5em;
  display: block;
  border-top: solid 0.2rem #00aeef;
  border-left: solid 0.2rem #00aeef;
  z-index: 100;
  pointer-events: none;
  content: "";
}

.contents-main-title::after{
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0;
  padding: 0;
  width: 1.5em;
  height: 1.5em;
  display: block;
  border-bottom: solid 0.2rem #00aeef;
  border-right: solid 0.2rem #00aeef;
  z-index: 100;
  pointer-events: none;
  content: "";
}


.contents-main-title-copy{
  position: relative;
  margin: auto;
  display: block;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-size: var(--font-size-xxl);
}

.contents-main-title-copy span{
  margin-bottom: 0.5em;
  display: block;
  font-size: var(--font-size-xl);
}

.contents-main-title-copy em{
  margin: -1em 0 1em -1em;
  padding: 0.5em 0;
  width: 6em;
  display: flex;
  justify-content: center;
  line-height: 1.2;
  letter-spacing: inherit;
  font-size: var(--font-size-s);
}

.contents-main-title-sub-copy{
  margin-top: 1em;
  line-height: 1.5;
  letter-spacing: 0.05em;
  font-size: var(--font-size-l);
}




.contents-title-block-mini{
  position: relative;
  width: 100%;
  height: 20rem;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;  
  background-color: #f7f7f7;
}

.contents-title-inner-mini{
  width: 94%;
  max-width: 100rem;
  display: flex;
  justify-content: flex-start;
  z-index: 100;
}

.contents-title-mini{
  position: relative;
  margin: 0 0 1.5em;

  display: block;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-size: var(--font-size-xxl);
  z-index: 10;
}

.contents-title-bg-mini{
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 20rem;
  z-index: 1;
}

.contents-title-bg-mini img{
  position: absolute;
  right: 0;
  margin: 0;
  padding: 0;
  width: 70%;
  max-width: 60rem;
  height: 20rem;
  object-fit: cover;
  object-position: center right;
}

@media screen and (max-width: 640px) {

.contents-title-bg-mini img{
  width: 100%;
  opacity: 0.45;
}

}/* End max 640 */


.contents-title-block{
  position: relative;
  width: 100%;
  height: 55vh;
  min-height: 42rem;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.contents-title-inner{
  display: flex;
  background: rgba(255,255,255,0.8);
  z-index: 100;
}

.contents-title{
  position: relative;
  margin: auto;
  display: block;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-size: var(--font-size-xxl);
}

.contents-title-sub-copy{
  margin-top: 1em;
  line-height: 1.5;
  letter-spacing: 0.05em;
  font-size: var(--font-size-l);
}

.contents-title-sub-copy em{ white-space: nowrap;}
.contents-title-sub-copy .scroll{ display: none;}


@media screen and (max-width: 640px) {

.contents-title-sub-copy::before{
  position: absolute;
  top: 0;
  bottom: 0;
  right: 3.6rem;
  margin: auto;
  padding: 0;
  width: 0.2rem; 
  height: calc(100% - 2em);
  display: flex;
  align-items: center;  
  background-color: #00aeef;  
  content: "";
  z-index: 100;
}

.contents-title-sub-copy::after{
  position: absolute;
  right: 3rem;
  margin: auto;
  padding: 0;
  width: 1.4rem; 
  height: 1.4rem;
  display: block;
  background-color: #00aeef;
  border-radius: 1rem;
  content: "";
  animation:scroll-move 1.6s ease-in-out infinite, scroll-hide 1.6s ease-out infinite;  
  z-index: 100;
}

#HEADER .news-anchor.news-off .number{ display: none;}

.contents-title-sub-copy .scroll{
  position: absolute;
  top: 0;
  bottom: 0;
  right: -1em;
  margin: auto;
  padding: 0;
  height: 1em;  
  display: block;
  color: #00aeef;  
  font-size: var(--font-size-s);
  font-weight: 600;
  letter-spacing: inherit;
  transform: rotate( 90deg );
  z-index: 100;
}

}/* End max 640 */


@keyframes scroll-move{
  0%{bottom:calc(100% - 1.5em);}
  80%{bottom:calc(0% + 1em);}
  100%{bottom:calc(0% + 1em);}
 }

@keyframes scroll-hide{
  0%{opacity:0}
  50%{opacity:1;}
  80%{opacity:0.9;}
  100%{opacity:0;}
 }


.contents-title-bg{
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
}

.contents-title-bg .main-image{
  width: 80vw;
  display: block;  
  height: 55vh;
  min-height: 42rem;
  object-fit: cover;
  object-position: top left; 
}

.contents-title-block .sp-image{ display: none;}
.contents-title-block .pc-image{ display: block;}


@media screen and (min-width: 1400px) {

.contents-title-bg .main-image{ width: 64vw;}

}/* End min 1200 */

@media screen and (min-width: 641px) and (max-width: 1000px) {


.contents-title-bg .main-image{ width: 90vw;}

.contents-title-bg{
  position: absolute;
  top: 0;
  margin: 0;
  padding: 0;
  width: 100%;
}

.contents-title-bg .main-image{
  width: 90vw;
  display: block;  
  height: 30vh;
  min-height: 32rem;
  object-fit: cover;
  object-position: top left;  
}

.contents-title-block{
  position: relative;
  width: 100%;
  height: 50vh;
  min-height: 42rem;
  max-height: 45rem;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
}

.contents-title-inner{
  padding: 1em;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  background: rgba(255,255,255,0.8);
  width: 94%;
  z-index: 100;
}

}/* End min 641 max 1000 */


@media screen and (max-width: 640px) {

.contents-title-block{
  height: calc(100vh - 4rem);
  height: calc(100svh - 4rem);
}

.contents-title-bg .sp-image{ display: block;}
.contents-title-bg .pc-image{ display: none;}

.contents-title-bg .main-image{
  width: 100%;
  height: calc(100vh - 4rem);
  height: calc(100svh - 4rem);
  object-fit: cover;
}

}/* End max 640 */



/* SECTION */

#CONTENTS{
  position: relative;
  width: 100%;
  text-align: left;
  z-index: 1;
}

.contents-section{
  position: relative;
  margin: auto;
  width: 94%;
  max-width: 100rem;
}

.contents-section-full{
  position: relative;
  margin: auto;
  width: 100%;
}

.section-inner{
  position: relative;
  margin: auto;
  width: 100%;
}

.section-inner-collabo{
  position: relative;
  margin: auto;
  width: 100%;
  max-width: 60rem;
  box-shadow: 0rem 0rem 0.4rem rgb(136, 136, 136);
}

.border-radius-3{border-radius:3em}
.border-radius-04{border-radius:0.4em}


.contents-section-full .section-inner{
  position: relative;
  margin: auto;
  width: 94%;
  max-width: 100rem;
}


section .inner-txt-block{
  position: relative;
  margin: auto;
  width: 100%;
  max-width: 72rem;
}


section .info-block{
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  border-radius: 0.4em;
}


section .info-block.bg-gray,
section .inner-block.bg-gray{ background-color: #f1f1f1;}
section .info-block.bg-blue,
section .inner-block.bg-blue{ background-color: #e6f8ff;}
section .info-block.bg-red,
section .inner-block.bg-red{ background-color: #ffeaec;}

section .info-block.bg-white,
section .inner-block.bg-white{ background-color: #fff;}

section .info-block.border-gray,
section .inner-block.border-gray { border: 1px solid  #ccc;}
section .info-block.border-blue,
section .inner-block.border-blue { border: 1px solid #00aeef;}
section .info-block.border-red,
section .inner-block.border-red { border: 1px solid #d32d26;}

.bg-color-jhdac-blue { background-color: #00aeef;}
.bg-color-white { background-color: #fff;}

section .angle{ position: relative;}

section .angle::before,
section .angle::after{
  position: absolute;
  margin: 0;
  padding: 0;
  width: 3rem;
  height: 3rem;
  display: block;
  background-color: transparent;
  border: solid 0.2rem #00aeef;
  border-width: 0.2rem 0 0 0.2rem;
  content: "";
  z-index: 10;
}

section .angle-gray::before,
section .angle-gray::after{ border: solid 0.2rem #999; border-width: 0.2rem 0 0 0.2rem;}

section .angle.angle-s::before,
section .angle.angle-s::after{ width: 1.5rem; height: 1.5rem;}

section .angle.angle-l::before,
section .angle.angle-l::after{ width: 5rem; height: 5rem;}

section .angle::before{ top: 0; left: 0;}
section .angle::after{ bottom: 0; right: 0; transform: rotate( 180deg );}

section .angle-txt-block{
  position: relative;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}



/* SECTION TITLE */

.section-title{
  position: relative;
  margin: 0 0 1em;
  padding: 0.5rem 1.5rem;
  display: block;
  border-left: 1rem solid #00aeef;
  font-size: var(--font-size-xxl);
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.section-sub-title-01{
  position: relative;
  margin: 0 0 1em;
  padding: 0.8rem 0;
  display: block;
  border-bottom: 0.1rem solid #999;
  font-size: var(--font-size-xl);
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.section-sub-title-02{
  position: relative;
  margin: 0 0 1em;
  padding: 0.8rem 0;
  display: block;
  border-bottom: 0.1rem dotted #999;
  font-size: var(--font-size-l);
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.collabo-number{
 padding: 0.5em 1em;
}

.section-sub-title-03{
  position: relative;
  margin: 0 0 1em;
  padding: 0;  width: 100%;
  display: flex;
  align-items: center;
  font-size: var(--font-size-l);
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.section-sub-title-03::after {
  margin-left: 1em;
  height: 0.1rem;
  display: block;
  flex-grow: 1;
  background: #999;
  content: "";
}

.section-sub-title-04{
  position: relative;
  margin: 0 0 1em;
  padding: 0;
  width: 100%;
  display: flex;
  align-items: center;
  font-size: var(--font-size-m);
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.4;
}
.section-sub-title-04::before,
.section-sub-title-04::after{
  height: 0.1rem;
  display: block;
  flex-grow: 1;
  background: #999;
  content: "";
}

.section-sub-title-04::before{ margin-right: 1em;}
.section-sub-title-04::after{ margin-left: 1em;}



/* TEXT LIST LINK COLOR */

.text-align-center{ text-align: center;}
.text-align-right{ text-align: right;}

.lead-txt{
  margin: 0 0 1em;
  font-size: var(--font-size-l);
  line-height: 1.8;
}

.txt{
  margin: 0 0 1em;
  font-size: var(--font-size-m);
  line-height: 1.8;
}

.nowrap{ white-space: nowrap;}

sup { padding-right: 0.5rem; font-size: 80%; vertical-align: super;}
sub { padding-right: 0.5rem; font-size: 80%; vertical-align: sub;}

.sp_br { display: inline;}
.sp_blind { display: none;}
.pc_br { display: none;}
.pc_blind { display: block;}

@media screen and (min-width: 641px) {
.sp_br { display: none;}
.sp_blind { display: block;}
.pc_br { display: inline;}
.pc_blind { display: none;}
}/* End max 640 */

.list-ul li{
  margin: 0 0 0 1.5em;
  padding: 0 0 0.5em 0;
  list-style-type: disc;
}

.list-ol li{
  margin: 0 0 0 1.5em;
  padding: 0 0 0.5em 0;
  list-style-type: decimal;
}

.list-style-none li{margin: 0; padding: 0 0 0.5em 0; list-style-type: none;}

.pdf-list li,
.movie-list li{
  position: relative;
  margin: 0 0 0.5em 0;
  padding: 0 0 0 2.5rem;
  list-style: none;
  font-size: 1.6rem;
  line-height: 1.6;
  text-align: left;
}

.pdf-list li:before {
  position: absolute;
  top: 0;
  left: -0.1rem;
  margin: auto;
  width: 2rem;
  height: 2rem;
  display: block;
  background: url(/common/img/icon_pdf.svg) center center no-repeat;
  background-size: contain;
  content: "";
}

.movie-list li:before {
  position: absolute;
  top: 0;
  left: -0.1rem;
  margin: auto;
  width: 2rem;
  height: 2rem;
  display: block;
  background: url(/common/img/icon_movie.svg) center center no-repeat;
  background-size: contain;
  content: "";
}


/* notice */

.notice-txt,
.notice-list li{
  position: relative;
  margin: 0 0 1em 1.5em;
  padding: 0;
  text-align: left;
}

.notice-txt-r{
  color: #f30;
}

.notice-list li{ margin: 0 0 0.5em 1.5em; list-style: none;}

.notice-txt:before,
.notice-list li:before{
  position: absolute;
  top: 0;
  left: -1.5em;
  padding: 0;
  color: #f30;
  content: "\203B";
}


.txt-color-nomal{ color: #00aeef;}
.txt-color-w{ color: #fff;}
.txt-color-b{ color: #333;}
.txt-color-r{ color: #c00;}

.txt-color-nomal:visited,
.txt-color-nomal:hover,
.txt-color-nomal:focus,
.txt-color-nomal:active { color: #00aeef;}

.txt-color-w:visited,
.txt-color-w:hover,
.txt-color-w:focus,
.txt-color-w:active { color: #fff;}

.txt-color-b:visited,
.txt-color-b:hover,
.txt-color-b:focus,
.txt-color-b:active { color: #333;}


/* LINK ARROW */

.arrow,
.pdf,
.movie{ position: relative; display: inline-block;}

.arrow.inline-block,
.pdf.inline-block{ display: inline-block;}

.arrow-m{ padding-left: 1.6rem;}
.arrow-l{ padding-left: 2rem;}
.pdf-m,.movie-m{ padding-left: 2rem;}
.pdf-l{ padding-left: 2.8rem;}

.arrow-m::before{
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 0.8rem;
  height: 0.8rem;
  display: block;
  border-top: 0.2rem solid #00aeef;
  border-right: 0.2rem solid #00aeef;
  transform: rotate( 45deg );
  content: "";
}

.arrow-l::before{
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 1.2rem;
  height: 1.2rem;
  display: block;
  border-top: 0.3rem solid #00aeef;
  border-right: 0.3rem solid #00aeef;
  transform: rotate( 45deg );
  content: "";
}

.arrow-anchor::before{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 1rem;
  height: 1rem;
  display: block;
  border-bottom: solid 0.3rem #00aeef;
  border-right: solid 0.3rem #00aeef;
  transform: rotate(45deg);
  content: "";
  pointer-events: none;
  z-index: 100;
}

.arrow-m.arrow-white::before{
  border-top: 0.2rem solid #fff;
  border-right: 0.2rem solid #fff;
}

.arrow-l.arrow-white::before{
  border-top: 0.3rem solid #fff;
  border-right: 0.3rem solid #fff;
}

.arrow-anchor.arrow-white::before{
  border-bottom: solid 0.3rem #fff;
  border-right: solid 0.3rem #fff;
}


.pdf-m:before,
.pdf-l:before,
.movie-m:before {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  display: block;
  content: "";
}

.pdf-m:before {
  width: 2rem;
  height: 2rem;
  background: url(/common/img/icon_pdf.svg) center center no-repeat;
  background-size: contain;
}

.pdf-l:before {
  width: 2.4rem;
  height: 2.4rem;
  background: url(/common/img/icon_pdf.svg) center center no-repeat;
  background-size: contain;
}

.movie-m:before {
  width: 2rem;
  height: 2rem;
  background: url(/common/img/icon_movie.svg) center center no-repeat;
  background-size: contain;
}




/* button */

.button{
  position: relative;
  margin: auto;
  padding: 0;
  width: 80%;
  max-width: 32rem;
}

.button.size-l{
  width: 90%;
  max-width: 42rem;
}

.button a{
  position: relative;
  margin: 0;
  padding: 0.6em 0.8em;
  display: block;
  border-radius: 3em;
  background-color: #00aeef;
  color: #fff;
  text-align: center;
  cursor: pointer;
}

.button a::before{
  position: absolute;
  top: 0;
  left: 1rem;
  bottom: 0;
  margin: auto;
  width: 1.2rem;
  height: 1.2rem;
  display: block;
  border-top: 0.3rem solid #fff;
  border-right: 0.3rem solid #fff;
  transform: rotate( 45deg );
  content: "";
}

.button.button-white a{
  border: 0.1rem solid #00aeef;
  background-color: #fff;
  color: #00aeef;
}

.button.button-white a::before{
  border-top: 0.3rem solid #00aeef;
  border-right: 0.3rem solid #00aeef;
  transform: rotate( 45deg );
}

.button.salon-button a{
  background-color: #00bd78;
  color: #fff;
}

.button.salon-button.button-white a{
  border: 0.1rem solid #00bd78;
  background-color: #fff;
  color: #00bd78;
}

.button.salon-button.button-white a::before{
  border-top: 0.3rem solid #00bd78;
  border-right: 0.3rem solid #00bd78;
}



.button-parallel{
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.button-parallel .button{ margin: 0.5em;}

.nolink.button a {
  background-color: #ccc;
  pointer-events: none;
  cursor: not-allowed;
}

/*split*/

.split{
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.split.space-between{ justify-content: space-between;}
.split.split-center{ justify-content: center;}

.split.align-items-top{ align-items: flex-start;}
.split.align-items-center{ align-items: center;}
.split.align-items-bottom{ align-items: flex-end;}

.split .full{ width: 100%;}
.split .size-70{ width: 70%;}
.split .size-60{ width: 60%;}
.split .size-50{ width: 50%;}
.split .size-40{ width: 40%;}
.split .size-30{ width: 30%;}

.split .split-3{ width: 33.333333333333333333333333333%;}
.split .split-4{ width: 25%;}
.split .split-5{ width: 20%;}


.split .bg-sample-01{ background-color: #e1fffe;}
.split .bg-sample-02{ background-color: #ffeeee;}



@media screen and (max-width: 640px) {

.split .sp-non-split.size-70,
.split .sp-non-split.size-60,
.split .sp-non-split.size-50,
.split .sp-non-split.size-40,
.split .sp-non-split.size-30{ width: 100%;}

.split .sp-non-split.pl-1,
.split .sp-non-split.pl-2,
.split .sp-non-split.pl-3,
.split .sp-non-split.pl-4{ padding-left: 0;}

.split .sp-non-split.pr-1,
.split .sp-non-split.pr-2,
.split .sp-non-split.pr-3,
.split .sp-non-split.pr-4{ padding-right: 0;}


}/* max 640 */


/*** IMAGE ASPECT-RATIO ***/



.aspect-1-1 { aspect-ratio: 1 / 1;}
.aspect-1-2 { aspect-ratio: 1 / 2;}
.aspect-2-1 { aspect-ratio: 2 / 1;}
.aspect-3-1 { aspect-ratio: 3 / 1;}
.aspect-3-2 { aspect-ratio: 3 / 2;}
.aspect-6-4 { aspect-ratio: 3 / 2;}
.aspect-4-3 { aspect-ratio: 4 / 3;}
.aspect-9-16 { aspect-ratio: 9 / 16;}
.aspect-10-1 { aspect-ratio: 10 / 1;}
.aspect-16-9 { aspect-ratio: 16 / 9;}

/* IMAGE */

.image{ margin: 0 auto; width: 100%; display: block;}

.image-box{ position: relative; margin: auto; display: block; overflow: hidden; width: 100%; height: auto;}

.image-box img{ display: block; position: absolute;}

.image-box.image-size-ss,.image.image-size-ss{ max-width: 8rem;}
.image-box.image-size-s,.image.image-size-s{ max-width: 16rem;}
.image-box.image-size-sm,.image.image-size-sm { max-width: 30rem;}
.image-box.image-size-m,.image.image-size-m{ max-width: 40rem;}
.image-box.image-size-l,.image.image-size-l{ max-width: 60rem;}
.image-box.image-size-ll,.image.image-size-ll{ max-width: 80rem;}
.image-box.image-border,.image.image-border { border: 0.1rem solid #9f9f9f;}

@media screen and (max-width: 580px), print {

.svg-image-s{ margin: auto; width: 45%; display: block;}
.svg-image-m{ margin: auto; width: 75%; display: block;}


}/* End 580 */

/* movie */
.popup-iframe{
  border:0.1rem solid #ccc;
}

.popup-iframe:before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 60px;
  height: 60px;
  background: url(/funding/common/img/youtube.svg) center center no-repeat;
  content: "";
  z-index: 1;
}
/* End movie */


/* PHOTO */

.photo-landscape img{
  margin: auto;
  width: 100%;
  max-width: 60rem;
  aspect-ratio: 3 / 2;
}

.photo-landscape-wide img{
  margin: auto;
  width: 100%;
  max-width: 80rem;
  aspect-ratio: 16 / 9;
}

.photo-portrait img{
  margin: auto;
  width: 100%;
  max-width: 30rem;
  aspect-ratio: 3 / 4;
}


.photo-gallery-slider,
.top-colabo-slider{
  position: relative;
  margin: 0 auto;  
  width: 100%;
  max-width: 80rem;
}

.photo-gallery-slider.size-m{ max-width: 60rem;}
.photo-gallery-slider.size-s{ max-width: 40rem;}

.issue-slider .swiper-wrapper,
.photo-gallery-slider .swiper-wrapper,
.top-colabo-slider .swiper-wrapper{padding: 0 0 1.5em;}
.issue-slider .swiper-pagination-bullets.swiper-pagination-horizontal,
.photo-gallery-slider .swiper-pagination-bullets.swiper-pagination-horizontal,
.top-colabo-slider .swiper-pagination-bullets.swiper-pagination-horizontal{ bottom: 0em;}

.issue-slider .swiper-button-prev::after,
.photo-gallery-slider .swiper-button-prev::after,
.top-colabo-slider .swiper-button-prev::after{
  margin: -1em auto 0;
  content: "";
  height: 1.8rem;  
  width: 1.8rem;
  border-bottom: 0.3rem solid #00aeef;
  border-left: 0.3rem solid #00aeef;
  transform: rotate( 45deg );
}

.issue-slider .swiper-button-next::after,
.photo-gallery-slider .swiper-button-next::after,
.top-colabo-slider .swiper-button-next::after{
  margin: -1em auto 0;
  content: "";
  height: 1.8rem;  
  width: 1.8rem;
  border-top: 0.3rem solid #00aeef;
  border-right: 0.3rem solid #00aeef;
  transform: rotate( 45deg );
}

.issue-slider .swiper-pagination-bullet,
.photo-gallery-slider .swiper-pagination-bullet,
.top-colabo-slider .swiper-pagination-bullet{ background-color: #00aeef;}

.mt-1{ margin-top: 1em;}
.mt-2{ margin-top: 2em;}
.mt-3{ margin-top: 3em;}
.mt-4{ margin-top: 4em;}
.mt-5{ margin-top: 5em;}
.mt-6{ margin-top: 6em;}
.mt-7{ margin-top: 7em;}

.mb-1{ margin-bottom: 1em;}
.mb-2{ margin-bottom: 2em;}
.mb-3{ margin-bottom: 3em;}
.mb-4{ margin-bottom: 4em;}
.mb-5{ margin-bottom: 5em;}
.mb-6{ margin-bottom: 6em;}
.mb-7{ margin-bottom: 7em;}

.ml-1{ margin-left: 1em;}
.ml-2{ margin-left: 2em;}
.ml-3{ margin-left: 3em;}
.ml-4{ margin-left: 4em;}

.mr-1{ margin-right: 1em;}
.mr-2{ margin-right: 2em;}
.mr-3{ margin-right: 3em;}
.mr-4{ margin-right: 4em;}

.pt-1{ padding-top: 1em;}
.pt-2{ padding-top: 2em;}
.pt-3{ padding-top: 3em;}
.pt-4{ padding-top: 4em;}
.pt-5{ padding-top: 5em;}
.pt-6{ padding-top: 6em;}
.pt-7{ padding-top: 7em;}

.pb-1{ padding-bottom: 1em;}
.pb-2{ padding-bottom: 2em;}
.pb-3{ padding-bottom: 3em;}
.pb-4{ padding-bottom: 4em;}
.pb-5{ padding-bottom: 5em;}
.pb-6{ padding-bottom: 6em;}
.pb-7{ padding-bottom: 7em;}

.pl-1{ padding-left: 1em;}
.pl-2{ padding-left: 2em;}
.pl-3{ padding-left: 3em;}
.pl-4{ padding-left: 4em;}

.pr-1{ padding-right: 1em;}
.pr-2{ padding-right: 2em;}
.pr-3{ padding-right: 3em;}
.pr-4{ padding-right: 4em;}

.padding-1{ padding: 1em;}
.padding-2{ padding: 2em;}

@media screen and (max-width: 580px), print {

.padding-2{ padding: 1em;}


}/* End 580 */
