@charset "utf-8";


.hero-image { 
	background:url(./img/photo/3.jpg) no-repeat 0 0;
	height:660px;
}

.hero-image #header-midlayer { 
	height:100%; top:0; bottom:0; 
	background: -moz-linear-gradient(top, rgba(101,201,61,0.95) 0%, rgba(20,150,92,0.95) 52%, rgba(11,136,66,0.95) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(101,201,61,0.95)), color-stop(52%,rgba(20,150,92,0.95)), color-stop(100%,rgba(11,136,66,0.95)));
	background: -webkit-linear-gradient(top, rgba(101,201,61,0.95) 0%,rgba(20,150,92,0.95) 52%,rgba(11,136,66,0.95) 100%);
	background: -o-linear-gradient(top, rgba(101,201,61,0.95) 0%,rgba(20,150,92,0.95) 52%,rgba(11,136,66,0.95) 100%);
	background: -ms-linear-gradient(top, rgba(101,201,61,0.95) 0%,rgba(20,150,92,0.95) 52%,rgba(11,136,66,0.95) 100%);
	background: linear-gradient(to bottom, rgba(101,201,61,0.95) 0%,rgba(20,150,92,0.95) 52%,rgba(11,136,66,0.95) 100%);
}

/* + * + * + * + * + * + * + * + * + * + 
	Toppage Main Slider Setting
*/
#main-slider.container {padding:0 !important;}
.hero-image ul.slides {margin:0; padding:0;}
/* 
	in detail  --- Media Queries
+ * + * + * + * + * + * + * + * + * + */

.header-image {/**/}

.theme-gradation-layer { 
	position:relative;
	width:100%; height:100%; min-height:250px;
	background: -moz-linear-gradient(top, rgba(101,201,61,0.65) 0%, rgba(20,150,92,0.65) 52%, rgba(11,136,66,0.65) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(101,201,61,0.65)), color-stop(52%,rgba(20,150,92,0.65)), color-stop(100%,rgba(11,136,66,0.65)));
	background: -webkit-linear-gradient(top, rgba(101,201,61,0.65) 0%,rgba(20,150,92,0.65) 52%,rgba(11,136,66,0.65) 100%);
	background: -o-linear-gradient(top, rgba(101,201,61,0.65) 0%,rgba(20,150,92,0.65) 52%,rgba(11,136,66,0.65) 100%);
	background: -ms-linear-gradient(top, rgba(101,201,61,0.65) 0%,rgba(20,150,92,0.65) 52%,rgba(11,136,66,0.65) 100%);
	background: linear-gradient(to bottom, rgba(101,201,61,0.65) 0%,rgba(20,150,92,0.65) 52%,rgba(11,136,66,0.65) 100%);
}
.theme-gradation-layer:before {
	position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%;
	content: " ";
	background:url(./img/bg/pattern.png) repeat 0 0;
	z-index:-1;
}


#page-title p, #page-title h1 {font-size:200%; color:#fff; font-weight:bold; text-shadow:0 0 3px #111; margin:1em 0.25em; line-height:1.4em;}


#top-info {padding:6px;}

.btn-programs {font-size:1.2em; min-width:100% !important; margin-top:0.5em !important;}




/* + - + - + - + - + - + - + - + - + - +   swiper  + - + - + - + - + - + - + - + - + - + - +*/

.swiper-slide {display:inline-block; height:100% !important; margin:0.75em 0.5em; text-align:center;}
.swiper-slide dl {width:100%; margin:10px 0; padding:0;}
.swiper-slide dt {width:100%; margin:0; padding:0; text-align:center; line-height:1.5em; }
.swiper-slide dd{width:100%; margin:0; padding:0.5em 4%; text-align:left;  line-height:1.5em; }	
.swiper-slide img { width:100%; margin:0 auto;} 

.swiper-button-prev, .swiper-button-next {opacity:0.75; transition:all 0.3s linear 0s;}
.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled {opacity:0 !important; transition:all 0.3s linear 0s;}
.swiper-pagination { text-align: center; padding: 5px 0;}
.swiper-pagination-switch {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 8px;
	margin: 0 4px;
	background-color: #000;
	border: 1px solid #f4b;/*#188A77;*/
	cursor: pointer;
	transition: all .25s linear;
}
.swiper-active-switch {	background-color: #16AC94;}

.flick-and-scroll {position:absolute; bottom:17px; left:calc(50% - 80px); width:160px; height:20px; background:url(./img/icon/flick-and-scroll-bk.png) no-repeat center center; background-size:contain; z-index:-1;}
.click-to-see {position:absolute; top:35px; left:calc(50% - 76px); width:152px; height:35px; background:url(./img/icon/click-to-see-bk.png) no-repeat center center; background-size:contain; z-index:-1;}


.swiper-container1 {
	width: 100%; max-width:1200px;
	height: 410px; text-align:center; margin:0 auto;
	background:#E1F3E1;/*rgba(0,0,0,0.1);*/
	overflow:hidden;
}
.swiper-container1 .swiper-slide {
	width: 85%; max-width:300px;
	height: 300px; margin:15px auto 0; text-align:center;
	background-size:cover; background-position:center center; background-repeat:no-repeat;
}


@media only screen and (min-width: 1269px) {
	.swiper-container2 .swiper-wrapper {margin-left:-500px;}
}
@media only screen and (min-width: 768px) and (max-width:1268px) {
	.swiper-container2 .swiper-wrapper {margin-left:-250px;}
}
@media only screen and (min-width: 601px) and (max-width:768px) {
	.swiper-container2 .swiper-wrapper {margin-left:-32.5%;}
}
.swiper-container2 {
	width: 100%; /*max-width:950px;*/
	height: 320px; text-align:center; margin:0 auto;
	background:rgba(0,0,0,0.1);
	overflow:hidden;
}
.swiper-container2 .swiper-slide {
	width: 250px;
	height: 220px; margin:15px auto 0; text-align:center;
	background-size:cover; background-position:center center; background-repeat:no-repeat;
}
.swiper-container2 .swiper-slide dt {font-size:14px; /*color:#fff;*/}
.swiper-container2 .ytimgWrapper:after {
	position:absolute;
	content:" "; text-align:center; margin:auto;
	top:0; left:0; right:0; bottom:0; width:calc(80px * 0.75); height:calc(60px * 0.75);
	background-size:15px 15px;
}



/*
.flick-and-scroll {position:absolute; bottom:15px; left:50%; margin-left:-80px; width:160px; height:20px; background:url(./img/icon/flick-and-scroll.png) no-repeat center center; background-size:contain; z-index:-1;}
.click-circles {position:absolute; top:35px; left:50%; margin-left:-76px; width:152px; height:35px; background:url(./img/icon/click-circles.png) no-repeat center center; background-size:contain; z-index:-1;}

.bg-bg1 .flick-and-scroll {position:absolute; bottom:15px; left:50%; margin-left:-80px; width:160px; height:20px; background:url(./img/icon/flick-and-scroll.png) no-repeat center center; background-size:contain; z-index:-1;}
.bg-bg1 .click-circles {position:absolute; top:35px; left:50%; margin-left:-76px; width:152px; height:35px; background:url(./img/icon/click-circles.png) no-repeat center center; background-size:contain; z-index:-1;}
*/




#verse1 .imgframe{ 
	display:block; margin:0 0 1.25em;
	width:100%; height:250px; 
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
}


@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
#etc img[src$=".svg"] {
		width: 100% !important; 
	}
}


#editorial .editorial-date, .notes .notes-date {font-size:13px;}
#editorial dt h3, .notes dt h3 {text-align:left !important; line-height:1.35em; margin-top:0.5em; padding:0 0.75em; font-size:100%; font-weight:normal;} 
#editorial dd > p, .notes dd > p {text-align:left; } 


#feature .cell.trio {
	position:relative;
	background-repeat:no-repeat;
	background-position:center 65%;
	background-size:auto;
}
#feature .cell.trio a {display:block;}
.feature-circle {transition:all 0.33s linear 0s;}
.feature-circle:hover {
	transform:scale(1.08);
	-webkit-filter: drop-shadow( 0 0 3px #fff );
	-moz-filter: drop-shadow( 0 0 3px #fff );
	-ms-filter: drop-shadow( 0 0 3px #fff );
	filter: drop-shadow( 0 0 3px #fff );	
	transition:all 0.15s linear 0s;
}
.feature-text {font-size:110%; line-height:1.7em; text-align:left;}

.activity-cell {
	position:relative; 
	aspect-ratio:1 / 1;
	text-shadow:0 0 1px rgba(0,0,0,0.7), 0 0 3px rgba(0,0,0,0.3);
}
@media (max-width:480px) {
	.activity-cell {aspect-ratio:4 / 3;}
}

.activity-cell .activity-cell-inner {position:absolute; top:0; right:0; bottom:0; left:0; width:100%;}
.activity-cell .overlay {
	position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%;
	/*background:url(./img/bg/pattern.png), rgba(30,30,30,0.15);*/
	background:rgba(30,30,30,0.2);
	background-repeat:repeat, auto;
	transition:all 0.3s linear 0s;
}
.activity-cell .overlay:hover {opacity:0; transition:all 0.3s linear 0s;}
.activity-cell h3 {font-size:26px; margin-top:20%; line-height:1.5em;}
.to-activity-page {width:60%; max-width:100px; transition:all 0.02s linear 0s;}
a:hover .to-activity-page {
	/*text-shadow:0 0 1px #fff, 0 0 2px #4bf, 0 0 5px #4bf;*/
	-webkit-filter: drop-shadow( 0 0 3px #4bf );
	-moz-filter: drop-shadow( 0 0 3px #4bf );
	-ms-filter: drop-shadow( 0 0 3px #4bf );
	filter: drop-shadow( 0 0 3px #4bf );
	transition:all 0.22s linear 0s;
}

/*
#activity .cell:after {
	position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%;
	content: " ";
	background:url(./img/bg/pattern.png) repeat 0 0;
}
*/


#instagram .excerpt {
	padding:0.5rem 0.75rem; line-height:1.35;
	font-size:0.9rem; font-weight:bold; 
	text-shadow:
		-1px -1px 1px rgba(0,0,0,0.9), 1px -1px 1px rgba(0,0,0,0.9), 
		-1px 1px 1px rgba(0,0,0,0.9), 1px 1px 1px rgba(0,0,0,0.9), 
		-1px -1px 2px rgba(0,0,0,0.66), 1px -1px 2px rgba(0,0,0,0.66),
		-1px 1px 2px rgba(0,0,0,0.66), 1px 1px 2px rgba(0,0,0,0.66), 0 0 2px rgba(0,0,0,0.66), ; 	
}
#instagram .to-instagram {padding:1em;}
#instagram .to-instagram:hover {
	-webkit-filter: drop-shadow( 0 0 3px #4bf );
	-moz-filter: drop-shadow( 0 0 3px #4bf );
	-ms-filter: drop-shadow( 0 0 3px #4bf );
	filter: drop-shadow( 0 0 3px #4bf );
	transition:all 0.22s linear 0s;
}



#activity h3 {font-size:1.25rem; line-height:1.4;}
#activity p.excerpt {font-size:0.9rem; line-height:1.4;}


#banvideo-1st {position:relative;}

#body-menu a img {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	opacity:0.3;
	transition:all 0.3s linear 0s;
}
#body-menu a img:hover {
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
	opacity:0.8;
	transition:all 0.3s linear 0s;
}

#history th, #spec th  {white-space:nowrap;}

li.chk-xl {
	line-height:1.35em;
	height: auto; font-size:36px;
	list-style:none; 
	background: url(./img/icon/chk.png) no-repeat 0 0;
	background-size:48px 48px;
	padding: 4px 0 6px 1.5em;
	margin: 0.5em 0;
}
li.chk {
	line-height:1.35em;
	height: auto; font-size:120%;
	background: url(./img/icon/chk.png) no-repeat 0 0;
	background-size:1.75em 1.75em;
	padding: 0.25em 0 0.5em 2.25em;
	margin: 0.75em 0;
}




.oneday dl {margin:0;}
.oneday dt {
	padding-top:1em;
	background: -moz-linear-gradient(top, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0) 88%);
	background: -webkit-linear-gradient(top, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0) 88%);
	background: -o-linear-gradient(top, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0) 88%);
	background: -ms-linear-gradient(top, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0) 88%);
	background: linear-gradient(to bottom, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0) 88%);
}
.oneday dt span.timestamp { display:block; font-size:42px; font-family:'Geosans-L'; padding:0.25em 0; color:#fff;/*#307550;*/}
.oneday dt span.caption { display:block; padding:0.5em 0 0 0.25em; font-size:21px;}
.oneday dd {padding:0 0.5em 1em;}
.oneday dd img {padding:0; margin:0;}


.case {margin:0; background:#E1F3E1; border:1px solid transparent; border-radius:6px; text-shadow:none !important; transition:all 0.33s linear 0s;}
/*
.case:hover {background:rgba(23,142,76,0.05); border:1px solid rgba(23,142,76,0.75); box-shadow:0 0 6px rgba(23,142,76,0.25) inset; transform:translateY(-4px); transition:all 0.14s linear 0s;}
*/
.case h3 {border:none; font-size:1.15em; font-weight:normal; margin:0; padding:0 0.25em;}
.case dt { text-align:left;}
.case dd {padding:0.5em; text-align:left;}
.case dd:last-child {margin-bottom:1em; text-align:center;}
.case ul {font-size:90%; margin:0;}
.case ul li {margin:0.25em 0; color:#444;}

.episode-meta {width:100%; max-width:550px; margin:1.5em auto 1em;}

img.face-photo {width:35vw; max-width:140px; border-radius:100%;}




.post-body section#custom-field {padding:8px 16px;}
.post-body section#custom-field h3.member {border:none; padding-left:0; margin-top:1em; margin-bottom:0.25em; color:#f7f7e7; text-shadow:1px 1px 4px #333,1px 1px 10px #777;}

.bubble {display:inline-block; position:relative; padding:1em; border-radius:6px; background:#fff;}
.bubble.to-right:before {position:absolute; left:-40px; bottom:50%; margin-bottom:-20px; content:""; border:20px solid transparent; border-right:20px solid #fff;} 
.bubble.to-left:before {position:absolute; right:-40px; bottom:50%; margin-bottom:-20px;  content:""; border:20px solid transparent; border-left:20px solid #fff;} 
.bubble.bordered {border:1px solid #bababa;} 
.bubble.bordered.to-right:before {position:absolute; left:-40px; bottom:50%; margin-bottom:-20px; content:""; border:20px solid transparent; border-right:20px solid #bababa;} 
.bubble.bordered.to-right:after {position:absolute; left:-39px; bottom:50%; margin-bottom:-20px; content:""; border:20px solid transparent; border-right:20px solid #fff;} 
.bubble.bordered.to-left:before {position:absolute; right:-40px; bottom:50%; margin-bottom:-20px;  content:""; border:20px solid transparent; border-left:20px solid #bababa;} 
.bubble.bordered.to-left:after {position:absolute; right:-39px; bottom:50%; margin-bottom:-20px;  content:""; border:20px solid transparent; border-left:20px solid #fff;} 


.blog-sel-trio p {font-size:14px; line-height:1.5em; margin-top:0;}
.blog-sel-trio .post-tn {display:block; float:left; width:64px; height:64px; margin:0 8px 8px 0; background:rgba(0,0,0,0.2); overflow:hidden;}
.blog-sel-trio .post-tn {display:block; float:left; width:64px; height:64px; margin:0 8px 8px 0; background:rgba(0,0,0,0.2); overflow:hidden;}
.rel-one table {margin:0;}
.blog-rel th, .blog-rel td {border:none;} 
.blog-rel th {width:130px !important; padding:10px;}
.blog-rel td {width:auto !important; padding:10px 10px 10px 0;}
.blog-rel .post-tn {display:block; width:100px; height:100px; margin:4px 2px; background:rgba(0,0,0,0.15); overflow:hidden;}
/*.blog-rel span.no-eyechatch {display:inline-block; width:100px; height:100px; background:rgba(0,0,0,0.15); overflow:hidden;}*/

/*
#info-readmore a {color:#fff;}
#info-readmore a:hover {text-decoration:underline;}
*/

#policy ol {margin:2em 0;}
#policy ol li {	line-height:1.7em; font-size:20px; margin:1em 0;}

#recent-post th div.post-tn {width:75px; height:75px; background:rgba(0,0,0,0.2); overflow:hidden;}
#recent-post td {line-height:1.5em; padding-right:0;}

table.blog-rel div.post-tn-100 {width:100px; height:100px; background:rgba(0,0,0,0.2); overflow:hidden;}
table.blog-rel div.post-tn-150 {width:150px; height:150px; background:rgba(0,0,0,0.2); overflow:hidden;}

/* pickup_cat-XXXXX.php */
#list-inner .item-cell {border-radius:6px; border:2px solid transparent; background:rgba(255,255,255,0.3); transition:all 0.3s linear 0s;}
#list-inner .item-cell:hover {border:2px solid rgba(255,255,255,0.75); background:rgba(255,255,255,0); transition:all 0.3s linear 0s;}

.bg-white #list-inner .item-cell {border-radius:6px; border:2px solid transparent; background:rgba(155,155,155,0.2); transition:all 0.3s linear 0s;}
.bg-white #list-inner .item-cell * {color: #666;} 
.bg-white #list-inner .item-cell:hover {border:2px solid rgba(155,155,155,0.75); background:rgba(255,255,255,0); transition:all 0.3s linear 0s;}




/*============================
  fancybox 3
*/
/*.fancybox-bg {background: rgba(3,29,13,0.97) !important;}*/
button.fancybox-button--close {z-index:99999 !important; background:var(--acc-color) !important; color:var(--black-color) !important;}
.fancybox-slide--iframe .fancybox-content {height:auto; max-height:85vh !important;}
.fancybox-active html {overflow:hidden;}
.fancybox-caption__body a:not([class]) {
	color:var(--fb-link-color) !important; 
	text-decoration: underline !important;
	text-underline-offset: 0.25em;
	text-decoration-style: dotted;
	text-decoration-skip-ink: auto;
}
.fancybox-caption__body a:hover {color:var(--fb-hover-color) !important;}
.fancybox-caption__body p {text-wrap: balance;}
.fancybox-slide--video .fancybox-content {
	width:clamp(300px,95%,800px) !important;
	aspect-ratio:16 / 9 !important;
	margin: 0;
}

.fancybox-caption__body {max-width:1280px; margin:auto; text-align:left;}
.fancybox-caption__body .to-insta-post {margin:1em 0 0; text-align:center; font-size:0.9rem;}
.to-insta-post a.permalink {display:inline-block; margin-inline:auto; color:#f3a !important; text-decoration:underline !important;}
.to-insta-post .icon-inside {width:1.2em; margin-inline:0.35em;}


@media (hover: hover) {
	button.fancybox-button--close:hover {color:#fff !important;}
	.to-insta-post a.permalink:hover {filter:saturate(300%); text-shadow:0 0 4px #f4b;}
}
@media (min-width:800px) {
	.fancybox-caption {font-size:1em !important;}
}
@media (max-width:480px) {
	.fancybox-slide--iframe {padding-inline:0.75em !important;}
	.fancybox-caption {padding-inline:0 !important;}
	.fancybox-caption__body {max-height:33vh !important; padding:1em 1.25em 2em; background:rgba(0,0,0,0.5); font-size:0.85rem; word-break:break-all;}
	.fancybox-caption__body p {margin:1em 0; text-align:left;}
	.fancybox-caption__body .to-insta-post {
		position:fixed; left:0; bottom:0; right:0;
		margin:auto;
		padding:0.5em 0.5em 1.25em;
		background: linear-gradient(90deg, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.9) 50%);	
		text-align:center;
		font-size:0.8rem; z-index:25252;
	}
	.fancybox-slide--video {padding-inline:0 !important;}
}


/********/



#loading {
  margin: 80px auto;
  font-size: 8px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(130,206,122,0.32);
  border-right: 1.1em solid rgba(130,206,122,0.32);
  border-bottom: 1.1em solid rgba(130,206,122,0.32);
  border-left: 1.1em solid #ffffff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
#loading,
#loading:after {
  border-radius: 50%;
  width: 6.5em;
  height: 6.5em;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
#loading{ position:fixed; left:50%; top:40%; margin-left:-3.25em; text-align:center;}


.powatt {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:2s;
	-ms-animation-duration:2s;
	animation-duration:2s;
	-webkit-animation-name: Powatter;
	animation-name: Powatter;
	visibility: visible !important;
}
@-webkit-keyframes Powatter {
	0% { opacity: 0; -webkit-transform: translateY(20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes Powatter {
	0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}



.fuwatt {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: Fuwatter;
	animation-name: Fuwatter;
	visibility: visible !important;
}
@-webkit-keyframes Fuwatter {
	0% { opacity: 0; -webkit-transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes Fuwatter {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

.fuwatt-short-delay {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: Fuwatter-LD;
	animation-name: Fuwatter-LD;
	visibility: visible !important;
    -webkit-animation-delay: 0.4s;
    -moz-animation-delay: 0.4s;
    -o-animation-delay: 0.4s;
    -ms-animation-delay: 0.4s;
    animation-delay: 0.4s; 	
}
@-webkit-keyframes Fuwatter-SD {
	0% { opacity: 0; -webkit-transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes Fuwatter-SD {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

.fuwatt-mid-delay {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: Fuwatter-LD;
	animation-name: Fuwatter-LD;
	visibility: visible !important;
    -webkit-animation-delay: 0.8s;
    -moz-animation-delay: 0.8s;
    -o-animation-delay: 0.8s;
    -ms-animation-delay: 0.8s;
    animation-delay: 0.8s; 	
}
@-webkit-keyframes Fuwatter-MD {
	0% { opacity: 0; -webkit-transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes Fuwatter-MD {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

.fuwatt-long-delay {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: Fuwatter-LD;
	animation-name: Fuwatter-LD;
	visibility: visible !important;
    -webkit-animation-delay: 1.2s;
    -moz-animation-delay: 1.2s;
    -o-animation-delay: 1.2s;
    -ms-animation-delay: 1.2s;
    animation-delay: 1.2s; 	
}
@-webkit-keyframes Fuwatter-LD {
	0% { opacity: 0; -webkit-transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes Fuwatter-LD {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}


.guwatt {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: Guwatter;
	animation-name: Guwatter;
	visibility: visible !important;
}
@-webkit-keyframes Guwatter {
	0% { opacity: 0; -webkit-transform: translateY(40px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes Guwatter {
	0% { opacity: 0; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}


.fuwa, .fuwa-sd, .fuwa-md, .fuwa-ld, .guwa {visibility:hidden;}




/* ^ * ^ * ^ * ^ * ^ * ^ * ^ * ^ * ^ * 
	Toppage Main Slider Animation
^ * ^ * ^ * ^ * ^ * ^ * ^ * ^ * ^ * ^ */
.flex-active-slide .hero-caption {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;	
	-webkit-animation-duration: 1s;
	-webkit-animation-name: catchText;
	animation-duration: 1s;
	animation-name: heroCaption;
}
@-webkit-keyframes heroCaption {
	0% { opacity: 0;}
	35% { opacity: 0; }
	100% { opacity: 1;}
}
@keyframes heroCaption {
	0% { opacity: 0;}
	35% { opacity: 0; }
	100% { opacity: 1;}
}


.flex-active-slide .hero-catch-circle {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;	
	-webkit-animation-duration: 1.3s;
	-webkit-animation-name: catchCircle;
	animation-duration: 1.3s;
	animation-name: catchCircle;
}
@-webkit-keyframes catchCircle {
	0% { opacity: 0.5; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); }
	100% { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
}
@keyframes catchCircle {
	0% { opacity: 0.5; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); }
	100% { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
}

.flex-active-slide .hero-catch-text {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;	
	-webkit-animation-duration: 1.8s;
	-webkit-animation-name: catchText;
	animation-duration: 1.8s;
	animation-name: catchText;
}
@-webkit-keyframes catchText {
	0% { opacity: 0; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px); }
	35% { opacity: 0; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
@keyframes catchText {
	0% { opacity: 0; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px); }
	35% { opacity: 0; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

.flex-active-slide .hero-catch-icon {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;	
	-webkit-animation-duration: 1.8s;
	-webkit-animation-name: catchIcon;
	animation-duration: 1.8s;
	animation-name: catchIcon;
}
@-webkit-keyframes catchIcon {
	0% { opacity: 0; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); }
	25% { opacity: 0; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
@keyframes catchIcon {
	0% { opacity: 0; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); }
	25% { opacity: 0; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}



/* =============================================================================
   Media Queries
   ========================================================================== */

@media only screen and (max-width: 1169px) {

	.btn-programs { width:100%; min-width:auto;}

}

@media only screen and (min-width: 996px) {
	/* + * + * + * + * + * + * + * + * + * + 
		Toppage Main Slider Setting -- PC
	*/
	/*.hero-image ul.slides li.hero-slide {}*/
	.hero-slide {position:relative; width:100%;/*1000px*/height:318px; margin:0; text-align:center;}
	.hero-caption { position:absolute; margin: auto; top:0; left: 0; bottom: 0; right: 0; width:55.5% !important; }
	.hero-slide .hero-catch-circle {position:absolute; top:15%; left:12.5%; width:21.8% !important; }
	.hero-slide .hero-catch-text {position:absolute; top:36%; left:34.3%; width:55.5% !important; }
	.hero-slide .hero-catch-icon {position:absolute; bottom:0; left:45%; width:22.2% !important; }
	/* + * + * + * + * + * + * + * + * + * + */

	#banvideo > div.shell {margin-bottom:1.5em;}


}


/* Tablet Portrait size to Base 996px */
@media only screen and (min-width: 768px) and (max-width: 995px) {

	/* + * + * + * + * + * + * + * + * + * + 
		Toppage Main Slider Setting -- Larger than iPad to small PC
	*/
	/*.hero-image ul.slides li.hero-slide {}*/
	.hero-slide {position:relative; width:100%;/*1000px*/height:32.55vw;/*260px;*/ margin:0; text-align:center;}
	.hero-caption { position:absolute; margin: auto; top:0; left: 0; bottom: 0; right: 0; width:65.5% !important; }
	.hero-slide .hero-catch-circle {position:absolute; top:15%; left:12.5%; width:21.8% !important; }
	.hero-slide .hero-catch-text {position:absolute; top:36%; left:34.3%; width:55.5% !important; }
	.hero-slide .hero-catch-icon {position:absolute; bottom:0; left:45%; width:22.2% !important; }
	/* + * + * + * + * + * + * + * + * + * + */


}

@media only screen and (min-width: 801px) {
	
	.hero-image, .header-image {background-attachment:fixed; background-size:cover; background-position:center bottom;}

}

@media only screen and (max-width: 800px) {

	#editorial dt h3, .notes dt h3 { font-size:19px; padding:0 0.5em;} 
	.hero-image, .header-image { background-attachment:scroll; background-size:cover; background-position:center center;}	

	.activity-cell .overlay {opacity:0.25;}

}


/* All Mobile Sizes */
@media only screen and (max-width: 768px) {

	.hero-image, .hero-image #header-midlayer { width: 100%; height: 75vh; }
	.hero-image p.catch-copy {	margin: 0; padding: 5vh 0 5vh; text-align: center;}	
	.custom-post.upper {padding-bottom:3em;}

	.oneday dl {margin:1.5em 0 2.5em;} 
	.oneday dd {padding:0;}
	.oneday dt {
		padding-bottom:1em;
		background: -moz-linear-gradient(left, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0.00) 100%);
		background: -webkit-linear-gradient(left, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0.00) 100%);
		background: -o-linear-gradient(left, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0.00) 100%);
		background: -ms-linear-gradient(left, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0.00) 100%);
		background: linear-gradient(to right, rgba(101,201,61,0.90) 0%, rgba(11,136,66,0.00) 100%);
	}
	.oneday dt span {display:inline-block !important;}
	.oneday dt span.timestamp {margin-right:0.5em;} 
	
	.bubble {width:auto; max-width:408px;}
	
}

/* Mobile Landscape Size to Tablet Portrait */
@media only screen and (min-width: 480px) and (max-width: 768px) {

	/* + * + * + * + * + * + * + * + * + * + 
		Toppage Main Slider Setting -- Larger than SmartPhone, Smaller than iPad
	*/
	/*.hero-image ul.slides li.hero-slide {}*/
	.hero-slide {position:relative; width:100%;/*1000px*/height:82.5vw;/*260px;*/ margin:auto; text-align:center;}
	.hero-caption { position:absolute; margin: auto; top:0; left: 0; bottom: 0; right: 0; width:82.5% !important; padding:0 !important;}
	.hero-slide .hero-catch-circle {position:absolute; top:2.5%; left:31.33%; width:40% !important; }
	.hero-slide .hero-catch-text {position:absolute; top:57.5%; left:0; right:0; margin: auto; width:90% !important; padding:0 !important;}
	.hero-slide .hero-catch-icon {position:absolute; bottom:0; left:0; right:0; margin: auto; width:42.2% !important; }
	/* + * + * + * + * + * + * + * + * + * + */

}

/* Mobile Portrait Size to Mobile Landscape Size */
@media only screen and (max-width: 479px) {

	.hero-image, .hero-image #header-midlayer { width: 100%; height:75vh;  }
	.hero-image p.catch-copy img { width:98%; max-width:450px; }		

	/* + * + * + * + * + * + * + * + * + * + 
		Toppage Main Slider Setting -- SmartPhone
	*/
	/*.hero-image ul.slides li.hero-slide {}*/
	.hero-slide {position:relative; width:100%;/*1000px*/height:95vw;/*260px;*/ margin:0; text-align:center;}
	.hero-caption { position:absolute; margin: auto; top:0; left: 0; bottom: 0; right: 0; width:99% !important; }
	.hero-slide .hero-catch-circle {position:absolute; top:2.5%; left:25%; width:50% !important; }
	.hero-slide .hero-catch-text {position:absolute; top:60%; left:0; right:0; margin: auto; width:100% !important; }
	.hero-slide .hero-catch-icon {position:absolute; bottom:0;  left:0; right:0; margin: auto; width:50% !important; }
	/* + * + * + * + * + * + * + * + * + * + */


	.swiper-container1 .swiper-slide { width: 93%; max-width:300px; }


	.flick-and-scroll {bottom:36px;}
	.swiper-pagination { text-align: center; bottom:2px !important;}

	.feature-text {font-size:125%; line-height:1.7em; text-align:left;}
	
	.bubble {padding:0.75em; font-size:90%; max-width:55vw;}
	.bubble.to-right:before {position:absolute; left:-32px; bottom:50%; margin-bottom:-16px; content:""; border:16px solid transparent; border-right:16px solid #fff;} 
	.bubble.to-left:before {position:absolute; right:-32px; bottom:50%; margin-bottom:-16px;  content:""; border:16px solid transparent; border-left:16px solid #fff;} 
	.bubble.bordered {border:1px solid #bababa;} 
	.bubble.bordered.to-right:before {position:absolute; left:-32px; bottom:50%; margin-bottom:-16px; content:""; border:16px solid transparent; border-right:16px solid #bababa;} 
	.bubble.bordered.to-right:after {position:absolute; left:-31px; bottom:50%; margin-bottom:-16px; content:""; border:16px solid transparent; border-right:16px solid #fff;} 
	.bubble.bordered.to-left:before {position:absolute; right:-32px; bottom:50%; margin-bottom:-16px;  content:""; border:16px solid transparent; border-left:16px solid #bababa;} 
	.bubble.bordered.to-left:after {position:absolute; right:-31px; bottom:50%; margin-bottom:-16px;  content:""; border:16px solid transparent; border-left:16px solid #fff;} 	
	
}


/* */