@charset "UTF-8";
/* CSS Document */


*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role='list'],ol[role='list']{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}


ul, li{
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
}




.marginB10{margin-bottom: 10px;}
.marginB20{margin-bottom: 20px;}
.marginB30{margin-bottom: 30px;}
.marginB40{margin-bottom: 40px;}
.marginB50{margin-bottom: 50px;}
.marginB60{margin-bottom: 60px;}
.marginB70{margin-bottom: 70px;}
.marginB80{margin-bottom: 80px;}
.marginB100{margin-bottom: 100px;}



.small_type{
  font-size: 85%;
}

img{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
}

a.normallink {
  color: #35b7ea;
  text-decoration: none;
}

a:hover {
  color: #35b7ea;
  font-weight: bold;
}


/* header 
=============*/

.container__head{
}

.catch_copy{
  border-top: 3px solid #999;
  border-bottom: 3px solid #999;
  margin-bottom: 3px;
}

.caption_title{
  border-top: 4px solid #eb69a3;
  border-bottom: 4px solid #eb69a3;
  padding: 15px 8px;
  margin-bottom: 20px;
  font-weight: normal;
}





.h3{font-size:80%;
font-weight:bold;
margin-bottom:5%;
line-height:1.3;}

.h3-title{
	border-left: 4px solid #000;
	padding-left: 16px;
	margin-top: 32px;
	vertical-align: middle;
}




.figure{margin-bottom:5%;}

.center{
text-align: center;
}




@media (min-width: 750px){
.article_pic{
  width: 80%;
  margin: auto;
}



.body {
  width:100%; 
  text-align:center; 
}
#wrap{
  width: 800px;
  margin: 5em auto;
  text-align:left; 
  font-size: 1em;
  font-family:  'Noto Sans Japanese', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
  color:"#000;
  padding: 0;
  background-color:#fff;
}


 }
 




.layout_container{
}



@media only screen and (min-width: 768px){
  body{
    background: #eee;
  }
  .layout_container{
	  width: 650px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 30px;
    padding-right: 30px;
    background: #fff;
  }
  .head_container{
	  width: 650px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 30px;
    padding-right: 30px;
    background: #fff;
  }
}

.container__title{
  padding: 0 5%;
  color: #333;
  line-height: 1.7;
  font-size: 150%;
  font-weight: 700;
	margin-bottom: 70px;
}
.container__title strong{
  color: #da5b6d;
}


.container_topic{
  padding: 3%;
  font-size: .9em;
  color: #666;
	border: 1px solid #666;
  margin-bottom: 50px;
}
.container_topic li{
	margin-bottom: 8px;
}
.container_topic a{
  color: #333;
}



.article_title{
	padding: 10px 15px;
	margin-top: 80px;
	margin-bottom: 15px;
	font-size: 1.2em;
  color: #fff;
	background: #6aa4d1;
}


.normal_text{
	line-height: 1.7;
	color: #34302c;
  padding-left: 15px;
  padding-right: 15px;
  font-size: 1em;
}
.small_text{
	font-size: 0.8em;
}

.annotation_area{
	background: #eee;
  padding: 10px;
}
.title_annotation{
  border-bottom: 1px solid #666;
  margin: 10px 10px 0px 10px;
  padding-bottom: 10px;
  font-family: 'Noto Serif JP', serif;
}

:root {
  --swiper-theme-color: #5996a3;
}

.swiper-button-next, .swiper-button-prev {
  color: #434343;
}


.marker {
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  background: linear-gradient(transparent 50%, #faf78c 0%);
  background-position: 0;
  background-size: 0;
  background-repeat: no-repeat;
  transition: background 3s;
  font-weight: bold;
  font-size: 1.1em;
}
.marker.active{
  background-size: 100% ;
}


strong{
	font-weight: 700;
  font-size: 105%;
}
strong.red{
	font-weight: 700;
  color: #e55d5e;
  font-size: 110%;
}
.underline_yellow{
  font-weight: bold;
	background: rgba(0, 0, 0, 0) -webkit-linear-gradient(transparent 60%, #ffff66 0%) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) -o-linear-gradient(transparent 60%, #ffff66 0%) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffff66 0%) repeat scroll 0 0;
}
.underline_blue{
  font-weight: bold;
	background: rgba(0, 0, 0, 0) -webkit-linear-gradient(transparent 60%, #cce0f5 0%) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) -o-linear-gradient(transparent 60%, #cce0f5 0%) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #cce0f5 0%) repeat scroll 0 0;
}
.over_pink{
	color: #d34d84;
}
.article_pic{
	text-align: center;
}





footer {
  background: #003c66;
  color:　#f4f4f4;
  padding: 40px 20px 40px
}

footer .footer-link {
  margin-bottom: 40px
}

footer .footer-link li {
  margin-bottom: 20px;
  text-align: center
}

footer .footer-link li a {
  color: #79D9E0;
  text-decoration: underline;
  font-size: 12px
}

footer .copyright {
  text-align: center;
  color: #FFF;
  font-size: 10px;
}











/* kengaの表示レイヤー調整 */
.kenga-overlay-image {
  z-index: 2 !important;
}




.ad_text {
  text-align: right;
  color: #474747;
  font-size: 12px;
  padding-right: 10px;
}



.adjustment_img{
  padding-left: 6%;
  padding-right: 6%;
}



@media only screen and (min-width: 768px) {

.sp_only{
  display: none;
}


}








/* スライダーの調整 */

.swiper-slide {
  color: #e0f4ed;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 100px;
}



.swiper-pagination-bullet {
    background: var(--swiper-pagination-bullet-inactive-color, #fff);
    opacity: var(--swiper-pagination-bullet-inactive-opacity, 1);
}
.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
}





/*===========
.scroll-box
===========*/
.scroll-box {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.scroll-box p{
  width: 140%;
}



/*===========
scrollbar
===========*/
/*スクロールバー全体の高さ*/
.scroll-box::-webkit-scrollbar {
  height: 4px;
}
/*スクロールバー全体の背景*/
.scroll-box::-webkit-scrollbar-track {
  background: #eee;
}
/*スクロールバーの動く部分*/
.scroll-box::-webkit-scrollbar-thumb {
  background: #aaa;
  border: none;
}
/*スクロールバーの動く部分のホバー（マウスオーバー）*/
.scroll-box::-webkit-scrollbar-thumb:hover {
  background: #999;
}








/* ふわふわ動き */
.motion_fuwa {
   animation: fuwafuwa 2s infinite;
}

@keyframes fuwafuwa {
  0% {
    transform: translateX(0px);
  }
  50% {
    transform: translateX(-10px);
  }
  100% {
    transform: translateX(0px);
  }
}