@charset "utf-8";
/* CSS Document */
body {
	background: #ffffdc;
	color: #333;
}
.g {
	color: #4cad04;
}
.y {
	color: #ffe600;
}
.o {
	color: #ff7f26;
}
i {
	font-weight: 700 !important;
}
.frame {
	display: none;
	position: fixed;
	background: url("../img/top/rainbow_bg.jpg") center center repeat;
	background-size: cover;
	z-index: 1000;
}
svg {
	width: 100%;
	display: block;
}
#line-top {
	top: 0;
	left: 0;
	width: 100%;
	height: 10px;
}
#line-left {
	top: 0;
	left: 0;
	height: 100%;
	width: 10px;
}
#line-right {
	top: 0;
	right: 0;
	height: 100%;
	width: 10px;
}
#line-bottom {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10px;
}
.pintitle {
	font-family: 'Crete Round';
	font-style: italic;
	letter-spacing: 1px;
	transition-delay: .3s;
}
.maintitle,
.pintitle {
	text-align: center;
	transition-duration: .5s;
	transform: translate(0, 30px);
	opacity: 0;
}
p, .btn, .btn-member, .movie_box {
	transition-duration: .5s;
	transform: translate(0, 30px);
	opacity: 0;
}
p {
	transition-delay: .3s;
}
.btn, .btn-member {
	transition-delay: .6s;
}
.btn-member {
	transition-delay: .6s;
}
.movie_box {
	transition-delay: .6s;
}
#maincontent {
	overflow: hidden;
}
#main_slider {
	position: relative;
	background: #ffe600;
}
.maintitle.on,
.pintitle.on {
	text-align: center;
	transform: translate(0, 0);
	opacity: 1;
}
p.on, .btn.on, .btn-member.on {
	text-align: center;
	transform: translate(0, 0);
	opacity: 1;
}
.movie_box.on {
	text-align: center;
	transform: translate(0, 0);
	opacity: 1;
}
.pintitle span {
	display: inline-block;
}
.pintitle span img {
	display: block;
}
.pintitle span.right {
	transform: rotate(180deg);
}
.pintitle strong {
	display: inline-block;
	vertical-align: middle;
}
#main_slider img {
	width: 100%;
}
#main_text {
	text-align: center;
}
#main_text img {
	width: auto;
}
#policy {
	background-color: #ffe600;
}

#copy {
	text-align: center;
	font-size: 12px;
	color: #4cad04;
}
#news {
	background-color: #5dd1a8;
}
#news .maintitle,
#news .pintitle {
	color: #fff;
}
#news .scroll {
	background: #fff;
}
#news dl {
	letter-spacing: 2px;
	border-bottom: 1px dotted #8cc63f;
}
#news dl dt {
	font-family: 'Crete Round';
}
#news dl dd.cat span {
	color: #fff;
	display: inline-block;
}
#news dl dd.cat span.cat1 { background-color: #ff728d; }
#news dl dd.cat span.cat2 { background-color: #7cdacb; }
#news dl dd.cat span.cat3 { background-color: #71be38; }

#news dl dd.news a {
	color: #5dd1a8;
}

#access {
	background-color: #ffe600;
}

#slider .item {
	text-align: center;
}
#slider .item .tl {
	font-weight: bold;
	background: #fff;
	border-radius: 50%;
}
#slider .item .tl span,
#slider .item .tl strong {
	display: block;
}
#slider .item .image {
	max-width: 300px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}
#slider .item .image:after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	position: absolute;
	background: url("../img/top/slider_bg.gif") 0 0 repeat;
	z-index: 1;
}
#slider .item .image img {
	border-radius: 50%;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	z-index: 5;
}
#slider .item .line {
	background: #333;
	color: #ffe600;
	display: inline-block;
	position: relative;
	z-index: 5;
}

#feature ul {
	display:-webkit-box;/*--- Androidブラウザ用 ---*/
	display:-ms-flexbox;/*--- IE10 ---*/
	display:-webkit-flex;/*--- safari（PC）用 ---*/
	display:flex;
	-webkit-flex-direction:row;
	flex-direction:row;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-between;
	justify-content:space-between;
	max-width: 1150px;
	margin: 0 auto;
}
#feature ul li a {
	display: block;
	position: relative;
}
#feature ul li a .panel {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}
#feature ul li a .panel span {
	color: #fff;
	width: 1em;
	letter-spacing: 2px;
	text-align: center;
	display: block;
	background-color: #ccc;
}
#feature ul li a .pict img {
	border: 5px solid;
}
#feature ul li.f1 a .pict img {border-color: #d6a3dc;}
#feature ul li.f1 a .panel span {background-color: #d6a3dc;}
#feature ul li.f1 a .pict,
#feature ul li.f1 a .panel {
	background: url("../img/top/hot_1bg.png") right bottom repeat;
}
#feature ul li.f2 a .pict img {border-color: #ffcf47;}
#feature ul li.f2 a .panel span {background-color: #ffcf47;}
#feature ul li.f2 a .pict,
#feature ul li.f2 a .panel {
	background: url("../img/top/hot_2bg.png") right bottom repeat;
}
#feature ul li.f3 a .pict img {border-color: #ffadad;}
#feature ul li.f3 a .panel span {background-color: #ffadad;}
#feature ul li.f3 a .pict,
#feature ul li.f3 a .panel {
	background: url("../img/top/hot_3bg.png") right bottom repeat;
}
#feature ul li.f4 a .pict img {border-color: #76cbe8;}
#feature ul li.f4 a .panel span {background-color: #76cbe8;}
#feature ul li.f4 a .pict,
#feature ul li.f4 a .panel {
	background: url("../img/top/hot_4bg.png") right bottom repeat;
}
#feature ul li.f5 a .pict img {border-color: #7cdacb;}
#feature ul li.f5 a .panel span {background-color: #7cdacb;}
#feature ul li.f5 a .pict,
#feature ul li.f5 a .panel {
	background: url("../img/top/hot_5bg.png") right bottom repeat;
}
#feature ul li.f6 a .pict img {border-color: #ffa644;}
#feature ul li.f6 a .panel span {background-color: #ffa644;}
#feature ul li.f6 a .pict,
#feature ul li.f6 a .panel {
	background: url("../img/top/hot_6bg.png") right bottom repeat;
}
.btn-member {
	width: 32.144%;
	max-width: 95%;
	margin-left:0;
	margin-right:0;
	text-align: center;
	position: relative;
	letter-spacing: 2px;
	transition-duration: .3s;
}
.btn-member a {
	display: block;
	border: 2px solid #4cad04;
	border-radius: 10px;
	background: #fff;
	line-height: 60px;
	transition-duration: .3s;
}
.btn-member a:hover {
	background: #4cad04;
	color: #fff;
	}
.title_area {
	padding: 5% 0;
}
.title_area.member {
	background: url(../../member/image/member_bg.png) no-repeat center top;
	-webkit-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.title_area h1 {
	margin-bottom: 24px;
	font-size: 40px;
	color: #fff;
	font-weight: bold;
	text-align: center;
	letter-spacing: 6px;
}
.title_area p {
	display: flex;
	display: -webkit-flex;
	display: -ms-flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	max-width: 220px;
	height: 28px;
	margin: auto;
	font-size: 15px;
	color: #ff728d;
	font-style: italic;
	font-family: 'Crete Round';
	background: #fff;
}
.member-sec {
	position: relative;
	padding: 6% 0 8%;
	background: url(../img/otayori/wave1.png) repeat-x 0 bottom #ffe600;
}
.member-sec .pic_ab {
	position: absolute;
	top: 10%;
	left: 5%;
}
.member-sec p {
	line-height: 2.0;
}
.member-sec .pic_ab + p {
	margin-top: 6%;
}
.member-sec .note {
	color: #c1272d;
}
.member-sec .btn_area {
	display: flex;
	display: -webkit-flex;
	display: -ms-flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
	align-items: center;
	max-width: 1120px;
	margin: 5% auto 0;
}
.member-sec .movie_wrap {
	max-width: 960px;
	margin: 2% auto 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}
.member-sec .movie_wrap .movie_box {
	background: #fff;
	width: 48.5%;
	margin: 20px 0;
	padding: 20px;
	border-radius: 5px;
	box-sizing: border-box;
}
.member-sec .movie_box .movie {
	position: relative;
	padding-top: 56.25%;
	height: 0;
}
.member-sec .movie_box .movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.member-sec .movie_box .movie_txt {
	padding-top: 10px;
	line-height: 1.6;
	text-align: center;
	color: #534741;
}

/* 1280px〜：大型PC
------------------------------ */
@media screen and (min-width:1280px) {
	header {
		width: 160px;
		text-align: center;
		position: fixed;
		left: 0;
		top: 0;
		background: #fff;
		height: 100%;
		font-size: 13px;
		letter-spacing: 1px;
		z-index: 10;
	}
	#sp_menu {
		display: none;
	}
	#header_logo-sp {
		display: none;
	}
	#header_logo {
		background: #FFFFFF;
		color: #fff;
		padding: 25px 15px 15px;
	}
	#header_logo:hover {
		background: #ffe600;
	}
	#header_logo a {
		display: block;
		color: #4FAD00;
	}
	#header_logo .logo {
		width: 50px;
		margin: 0 auto 12px;
	}
	.left_menu li {
		position: relative;
	}
	.left_menu li a {
		display: block;
		padding: 25px;
		transition-duration: .4s;
	}
	.left_menu li a:hover {
		background: #ffe600;
	}
	.left_menu li a i {
		display: block;
		font-size: 25px;
		margin-bottom: 14px;
	}
	.left_menu li ul {
		position: absolute;
		top: 0;
		left: 160px;
		width: 180px;
		background: #fff;
		text-align: left;
		display: none;
	}
	.left_menu li:hover ul {
		display: block;
	}
	
	.icon_menu {
		position: fixed;
		top: 135px;
		right: 30px;
		font-size: 12px;
	}
	.icon_menu ul li {
		margin-bottom: 10px;
	}
	.icon_menu ul li a {
		display: block;
		padding: 12px;
		transition-duration: .4s;
		border-radius: 5px;
		color: #fff;
		border: 2px solid;
	}
	.icon_menu li.icon1 a { background-color: #ffa442; border-color: #ffa442; }
	.icon_menu li.icon1 a:hover { color: #ffa442; }
	.icon_menu li.icon2 a { background-color: #ff728d; border-color: #ff728d; }
	.icon_menu li.icon2 a:hover { color: #ff728d; }
	.icon_menu li.icon3 a { background-color: #63dacc; border-color: #63dacc; }
	.icon_menu li.icon3 a:hover { color: #63dacc; }
	.icon_menu li.icon4 a { background-color: #977db4; border-color: #977db4; }
	.icon_menu li.icon4 a:hover { color: #977db4; }
	.icon_menu li.icon5 a { background-color: #71be38; border-color: #71be38; }
	.icon_menu li.icon5 a:hover { color: #71be38; }
	.icon_menu li a:hover { background-color: #fff; }
	.icon_menu li a i {
		display: block;
		font-size: 25px;
		margin-bottom: 10px;
		font-weight: 700;
	}
	.inquiry {
		position: fixed;
		top: 30px;
		right: 30px;
		font-size: 13px;
	}
	.inquiry a {
		display: block;
		background: #fff;
		line-height: 50px;
		border-radius: 25px;
		padding: 0 20px;
		transition-duration: .3s;
	}
	.inquiry a:hover {
		background: #ffe600;
	}
	.inquiry i {
		font-size: 25px;
		display: inline-block;
		vertical-align: middle;
		margin-right: 5px;
	}
	.pintitle span {
		width: 30px;
	}
	.pintitle strong {
		margin: 0 20px;
	}
	#maincontent {
		margin-left: 160px;
	}
	.maintitle {
		font-size: 35px;
		letter-spacing: 4px;
		font-weight: bold;
		margin-bottom: 30px;
	}
	.btn {
		width: 410px;
		margin-left:auto;
		margin-right:auto;
		text-align: center;
		position: relative;
		letter-spacing: 2px;
		transition-duration: .3s;
	}
	.btn a {
		display: block;
		border: 2px solid #333;
		border-radius: 10px;
		background: #fff;
		line-height: 60px;
		transition-duration: .3s;
	}
	.btn a i {
		font-size: 25px;
		display: inline-block;
		vertical-align: middle;
		position: absolute;
		right: 15px;
		top: 18px;
	}
	.btn a:hover {
		background: #333;
		color: #ffe600;
	}
	
	#main_icon {
		max-width: 174px;
		margin: 0 auto -50px;
		transform: translate(0,-100px);
	}
	#main_text {
		position: absolute;
		top: 20%;
		left: 0;
		width: 100%;
		height: 100%;
		text-align: center;
	}
	#policy {
		padding-bottom: 50px;
	}
	#policy h2 {
		margin-bottom: 50px;
	}
	#policy p {
		text-align: center;
		line-height: 35px;
	}
	#policy .wave {
		text-align: center;
	}
	#policy .wave h3 {
		display: inline-block;
		font-size: 25px;
		font-weight: bold;
		letter-spacing: 3px;
		margin: 20px 0;
		padding-bottom: 15px;
		background: url("../img/top/wave.png") 0 bottom repeat-x;
	}
	#policy .animation {
		transform: translate(0, -180px);
	}
	#policy .animation .pict1 {
		position: absolute;
		left: 100px;
		top: 0;
	}
	#policy .animation .pict2 {
		position: absolute;
		right: 30px;
		top: 0;
	}
	#policy .animation .pict3 {
		position: absolute;
		left: 60px;
		top: 50px;
	}
	#policy .animation .pict4 {
		position: absolute;
		right: 60px;
		top: 100px;
	}
	#policy .btn {
		margin-top: 35px;
	}
	#slider {
		margin: 30px 0;
	}
	#slider .item {
		padding: 5px 20px;
	}
	#slider .item .tl {
		border: 2px solid #333;
		width: 100px;
		margin: 0 auto;
		padding: 20px 0;
		box-sizing: border-box;
		position: relative;
		z-index: 10;
	}
	#slider .item .tl span {
		font-size: 15px;
		margin-bottom: 10px;
	}
	#slider .item .tl strong {
		font-size: 30px;
	}
	#slider .item .image {
		margin-top: -50px;
		margin-bottom: -50px;
	}
	#slider .item .image:after {
		top: 5px;
		left: 5px;
	}
	#slider .item .line {
		font-size: 18px;
		margin: 2px 0;
		padding: 10px;
	}
	#feature {
		padding: 60px 15px 100px;
	}
	#feature h2 {
		margin-bottom: 40px;
	}
	#feature ul li {
		margin: 30px 0;
	}
	#feature ul li a .panel {
		transition-duration: .4s;
		transform: translate(0,0);
	}
	#feature ul li a:hover .panel {
		transform: translate(-8px,-8px);
	}
	#feature ul li a .panel span {
		font-size: 18px;
		padding: 10px 15px 20px;
		transform: translate(-5px, -5px);
		transition-duration: .4s;
		-webkit-writing-mode: vertical-rl;
						-ms-writing-mode: tb-rl;
										writing-mode: vertical-rl;
	}
	#feature ul li a:hover .panel span {
		transform: translate(-6px, -6px);
	}
	#feature ul li a .pict img {
		transition-duration: .3s;
		transform: translate(0, 0);
	}
	#feature ul li a:hover .pict img {
		transform: translate(-5px, -5px);
	}
	#feature .animation {
		transform: translate(0, -140px);
		max-width: 1150px;
		margin: 0 auto;
	}
	#feature .animation .pict5 {
		position: absolute;
		top: 0;
		left: 0;
	}
	#feature .animation .pict6 {
		position: absolute;
		top: 0;
		right: 0;
	}
	#access {
		padding: 60px 15px 80px;
	}
	#access #map {
		max-width: 1140px;
		margin: 50px auto;
		border: 10px solid #fff;
		border-radius: 20px;
		overflow: hidden;
	}
	#access #map iframe {
		width: 100%;
		height: 450px;
		display: block;
	}
	#access p {
		text-align: center;
		margin-bottom: 40px;
		letter-spacing: 4px;
	}
	#access .animation {
		transform: translate(0, -160px);
		max-width: 1200px;
		margin: 0 auto;
	}
	#access .animation .pict7 {
		position: absolute;
		top: 0;
		left: 0;
	}
	#access .animation .pict8 {
		position: absolute;
		top: 0;
		right: 0;
	}
	#access .animation .pict9 {
		position: absolute;
		top: 30px;
		left: 0;
	}
	#news {
		padding: 60px 15px 100px;
	}
	#news .list {
		max-width: 1160px;
		margin: 15px auto 0;
		text-align: right;
	}
	#news .list a {
		color: #fff;
	}
	#news .list a i {
		font-size: 25px;
		display: inline-block;
		vertical-align: middle;
		margin-left: 10px;
	}
	#news .list a:hover {
		color: #ffe600;
	}
	#news .scroll {
		max-width: 1060px;
		margin: 20px auto 0;
		padding: 40px 50px;
		border-radius: 20px;
	}
	#news .scroll .in {
		overflow-y:scroll; 
		height: 200px;
	}
	#news dl {
		padding: 18px 18px 18px 50px;
		display:-webkit-box;
		display:-ms-flexbox;
		display:-webkit-flex;
		display:flex;
	}
	#news dl dt,
	#news dl dd {
		padding: 0 20px;
		line-height: 1.2;
	}
	#news dl dd.cat span {
		font-size: 12px;
		border-radius: 3px;
		padding: 6px;
		min-width: 6em;
	}
	#news .animation {
		transform: translate(0, -160px);
		max-width: 1100px;
		margin: 0 auto;
	}
	#news .animation .pict10 {
		position: absolute;
		top: 50px;
		left: -200px;
	}
	#news .animation .pict11 {
		position: absolute;
		top: -100px;
		right: -200px;
	}
	#contact {
		text-align: center;
		padding: 60px 0;
	}
	#contact .btn {
		margin: 40px auto;
	}
	#contact .tel {
		font-size: 25px;
		letter-spacing: 4px;
		margin-bottom: 20px;
	}
	#contact .add {
		letter-spacing: 2px;
	}
	#contact .animation {
		transform: translate(0, -80px);
	}
	#contact .animation .pict12 {
		position: absolute;
		top: 0;
		left: 80px;
	}
	#contact .animation .pict13 {
		position: absolute;
		right: -30px;
		top: 0;
	}
	#copy {
		margin: 60px 0 30px;
	}
}

/* ポップ
------------------------------*/
@-webkit-keyframes popUp {
	0% {
		transform: scale(0,0);
	}
	80% {
		transform: scale(1.1,1.1);
	}
	100% {
		transform: scale(1,1);
	}
}
@keyframes popUp {
	0% {
		transform: scale(0,0);
	}
	80% {
		transform: scale(1.1,1.1);
	}
	100% {
		transform: scale(1,1);
	}
}

.animation {
	position: relative;
}
.animation div {
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	transform: scale(0,0);
}
.animation div:nth-child(even) {
	-webkit-animation-delay: .5s;
	animation-delay: .5s;
}
.animation.on div {
	-webkit-animation-name: popUp;
	animation-name: popUp;
}


/* ポップアップスライド
------------------------------*/
@-webkit-keyframes popUpSlide {
	0% {
		transform: scale(1,0) translate(0, 30px);
	}
	80% {
		transform: scale(1,1.1) translate(0, -30px);
	}
	100% {
		transform: scale(1,1) translate(0, 0);
	}
}
@keyframes popUpSlide {
	0% {
		transform: scale(1,0) translate(0, 30px);
	}
	80% {
		transform: scale(1,1.1) translate(0, -30px);
	}
	100% {
		transform: scale(1,1) translate(0, 0);
	}
}

.popup {
	position: relative;
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	transform: scale(1,0) translate(0, 30px);
}
.popup.on {
	-webkit-animation-name: popUpSlide;
	animation-name: popUpSlide;
}
#policy,
#news {
	background-image: url("../img/top/wave1.png");
	background-position: 0 bottom;
	background-repeat: repeat-x;
}
#feature {
	background-image: url("../img/top/wave2.png");
	background-position: 0 bottom;
	background-repeat: repeat-x;
}
#access {
	background-image: url("../img/top/wave3.png");
	background-position: 0 bottom;
	background-repeat: repeat-x;
}

/* 〜1279px：小型PC
------------------------------ */
@media screen and (max-width:1279px) {
	body {
		padding-top: 110px;
	}
	header {
		width: 100%;
		text-align: center;
		position: fixed;
		left: 0;
		top: 0;
		background: #fff;
		height: auto;
		font-size: 13px;
		letter-spacing: 1px;
		z-index: 10;
	}
	#logo_area {
		position: relative;
	}
	header .menu_list {
		position: absolute;
		top: 103px;
		left: 0;
		width: 100%;
		background: rgba(255,255,255,.95);
		font-size: 14px;
		overflow-y: auto;
		display: none;
	}
	.left_menu {
		padding: 15px;
	}
	.left_menu li {
		text-align: left;
	}
	.left_menu li a {
		display: block;
		padding: 15px;
		border-bottom: 1px dotted #333;
	}
	.left_menu li a i {
		display: inline-block;
		width: 3em;
		text-align: center;
		font-size: 20px;
	}
	.icon_menu ul {
		display:-webkit-box;/*--- Androidブラウザ用 ---*/
		display:-ms-flexbox;/*--- IE10 ---*/
		display:-webkit-flex;/*--- safari（PC）用 ---*/
		display:flex;
		-webkit-flex-direction:row;
		flex-direction:row;
		-webkit-flex-wrap:wrap;
		flex-wrap:wrap;
		-webkit-justify-content:space-between;
		justify-content:space-between;
		padding: 0 15px;
	}
	.icon_menu ul li {
		text-align: left;
		width: 49%;
		margin: 5px 0;
	}
	.icon_menu ul li a {
		display: block;
		border-radius: 4px;
		color: #fff;
		padding: 15px;
	}
	.icon_menu li a i {
		font-size: 24px;
		display: inline-block;
		text-align: center;
		width: 3em;
		vertical-align: middle;
	}
	.icon_menu li.icon1 a { background-color: #ffa442; border-color: #ffa442; }
	.icon_menu li.icon2 a { background-color: #ff728d; border-color: #ff728d; }
	.icon_menu li.icon3 a { background-color: #63dacc; border-color: #63dacc; }
	.icon_menu li.icon4 a { background-color: #977db4; border-color: #977db4; }
	.icon_menu li.icon5 { display: none;}
	.inquiry {
		padding: 15px;
	}
	.inquiry a {
		display: block;
		border: 2px solid #333;
		border-radius: 6px;
		width: 60%;
		padding: 15px;
		margin: 0 auto;
	}
	.inquiry a i {
		display: inline-block;
		font-size: 24px;
		margin-right: 15px;
		vertical-align: middle;
	}
	#header_logo-sp {
		height: 83px;
		padding: 10px 0 10px 40px;
	}
	#header_logo-sp .box {
		display: flex;
		align-items: center;
	}
	#header_logo-sp .box .logo {
		width: 75px;
		margin-right: 20px;
	}
	#header_logo-sp p {
		font-size: 20px;
		color: #4cad04;
	}
	#header_logo {
		display: none;
		background: #fff;
		color: #4cad04;
		padding: 20px 10px 10px 20px;
		width: 120px;
		height: 90px;
		text-align: center;
	}
	#header_logo .logo {
		padding: 0 30px;
	}
	#header_logo p {
		font-size: 14px;
		margin-top: 10px;
		color: #4cad04;
	}
	#sp_menu {
		padding: 15px;
		width: 50px;
		text-align: center;
		position: absolute;
		top: 10px;
		right: 20px;
		cursor: pointer;
	}
	#sp_menu p {
		display: none;
		margin-top: 15px;
	}
	#sp_menu .bar span {
		display: block;
		width: 100%;
		height: 4px;
		background: #333;
		margin-top: 10px;
		transition-duration: .3s;
	}
	#sp_menu .close {
		display: none;
	}
	#sp_menu.active .open {
		display: none;
	}
	#sp_menu.active .close {
		display: none;
	}
	#sp_menu.active .bar span:nth-child(1) {
		transform: rotate(45deg) translate(10px,10px);
	}
	#sp_menu.active .bar span:nth-child(2) {
		transform: translate(50px,0);
		opacity: 0;
	}
	#sp_menu.active .bar span:nth-child(3) {
		transform: rotate(-45deg) translate(10px,-10px);
	}
	#main_text {
		position: absolute;
		top: 10%;
		left: 0;
		width: 100%;
		height: 100%;
		text-align: center;
	}
	#main_icon {
		max-width: 140px;
		margin: 0 auto -40px;
		transform: translate(0,-80px);
	}
	#main_text img {
		width: 420px;
	}
	#slider {
		margin: 30px 0;
	}
	#slider .item {
		padding: 5px 15px;
	}
	#slider .item .tl {
		border: 2px solid #333;
		width: 100px;
		margin: 0 auto;
		padding: 20px 0;
		box-sizing: border-box;
		position: relative;
		z-index: 10;
	}
	#slider .item .tl span {
		font-size: 14px;
		margin-bottom: 10px;
	}
	#slider .item .tl strong {
		font-size: 20px;
	}
	#slider .item .image {
		margin-top: -44px;
		margin-bottom: -44px;
	}
	#slider .item .image:after {
		top: 5px;
		left: 5px;
	}
	#slider .item .line {
		font-size: 18px;
		margin: 2px 0;
		padding: 10px;
	}
	.pintitle span {
		width: 30px;
	}
	.pintitle strong {
		margin: 0 20px;
	}
	.maintitle {
		font-size: 30px;
		letter-spacing: 4px;
		font-weight: bold;
		margin-bottom: 30px;
	}
	.btn {
		width: 380px;
		margin-left:auto;
		margin-right:auto;
		text-align: center;
	}
	.btn a {
		display: block;
		border: 2px solid #333;
		border-radius: 10px;
		background: #fff;
		line-height: 50px;
		position: relative;
		letter-spacing: 2px;
		transition-duration: .3s;
	}
	.btn a i {
		font-size: 25px;
		display: inline-block;
		vertical-align: middle;
		position: absolute;
		right: 15px;
		top: 18px;
	}
	.btn a:hover {
		background: #333;
		color: #ffe600;
	}
	#policy {
		padding-bottom: 50px;
	}
	#policy h2 {
		margin-bottom: 50px;
	}
	#policy p {
		text-align: center;
		line-height: 35px;
	}
	#policy .wave {
		text-align: center;
	}
	#policy .wave h3 {
		display: inline-block;
		font-size: 25px;
		font-weight: bold;
		letter-spacing: 3px;
		margin: 20px 0;
		padding-bottom: 15px;
		background: url("../img/top/wave.png") 0 bottom repeat-x;
	}
	#policy .animation {
		transform: translate(0, -150px);
	}
	#policy .animation .pict1 {
		position: absolute;
		left: 30px;
		top: 0;
		width: 140px;
	}
	#policy .animation .pict2 {
		position: absolute;
		right: 30px;
		top: 0;
		width: 140px;
	}
	#policy .animation .pict3 {
		position: absolute;
		left: 40px;
		top: 50px;
		width: 140px;
	}
	#policy .animation .pict4 {
		position: absolute;
		right: 40px;
		top: 100px;
		width: 140px;
	}
	#policy .btn {
		margin-top: 35px;
	}
	#feature {
		padding: 60px 15px 100px;
	}
	#feature h2 {
		margin-bottom: 40px;
	}
	#feature ul {
		margin: 0 auto;
		padding: 0 15px;
		max-width: 640px;
	}
	#feature ul li {
		margin: 30px 0;
		max-width: 46%;
	}
	#feature ul li a .panel {
		transition-duration: .4s;
		transform: translate(0,0);
	}
	#feature ul li a:hover .panel {
		transform: translate(-8px,-8px);
	}
	#feature ul li a .panel span {
		font-size: 18px;
		padding: 10px 15px 20px;
		transform: translate(-5px, -5px);
		transition-duration: .4s;
		-webkit-writing-mode: vertical-rl;
						-ms-writing-mode: tb-rl;
										writing-mode: vertical-rl;
	}
	#feature ul li a:hover .panel span {
		transform: translate(-6px, -6px);
	}
	#feature ul li a .pict img {
		transition-duration: .3s;
		transform: translate(0, 0);
	}
	#feature ul li a:hover .pict img {
		transform: translate(-5px, -5px);
	}
	#feature .animation {
		transform: translate(0, -140px);
		max-width: 1150px;
		margin: 0 auto;
	}
	#feature .animation .pict5 {
		position: absolute;
		top: 0;
		left: 0;
		width: 160px;
	}
	#feature .animation .pict6 {
		position: absolute;
		top: 0;
		right: 0;
		width: 160px;
	}
	#access {
		padding: 60px 15px;
	}
	#access #map {
		max-width: 1140px;
		margin: 50px auto;
		border: 10px solid #fff;
		border-radius: 20px;
		overflow: hidden;
	}
	#access #map iframe {
		width: 100%;
		height: 320px;
		display: block;
	}
	#access p {
		text-align: center;
		margin-bottom: 40px;
		letter-spacing: 4px;
	}
	#access .animation {
		transform: translate(0, -80px);
		max-width: 1200px;
		margin: 0 auto;
	}
	#access .animation .pict7 {
		position: absolute;
		top: 0;
		left: 0;
		width: 200px;
	}
	#access .animation .pict8 {
		position: absolute;
		top: 0;
		right: 0;
		width: 200px;
	}
	#access .animation .pict9 {
		position: absolute;
		top: 0;
		left: 0;
		width: 160px;
	}
	#news {
		padding: 60px 15px 100px;
	}
	#news .list {
		max-width: 1160px;
		margin: 15px auto 0;
		text-align: right;
	}
	#news .list a {
		color: #fff;
	}
	#news .list a i {
		font-size: 25px;
		display: inline-block;
		vertical-align: middle;
		margin-left: 10px;
	}
	#news .list a:hover {
		color: #ffe600;
	}
	#news .scroll {
		max-width: 1060px;
		margin: 20px auto 0;
		padding: 30px 40px;
		border-radius: 20px;
	}
	#news .scroll .in {
		overflow-y:scroll; 
		height: 200px;
	}
	#news dl {
		padding: 18px 18px 18px 20px;
		display:-webkit-box;
		display:-ms-flexbox;
		display:-webkit-flex;
		display:flex;
	}
	#news dl dt,
	#news dl dd {
		padding: 0 20px;
		line-height: 1.2;
	}
	#news dl dd.cat span {
		font-size: 12px;
		border-radius: 3px;
		padding: 6px;
		min-width: 6em;
	}
	#news .animation {
		transform: translate(0, -160px);
		max-width: 1100px;
		margin: 0 auto;
	}
	#news .animation .pict10 {
		position: absolute;
		top: 50px;
		left: 0px;
		width: 200px;
	}
	#news .animation .pict11 {
		position: absolute;
		top: -20px;
		right: 0px;
		width: 200px;
	}
	#contact {
		text-align: center;
		padding: 60px 0;
	}
	#contact .btn {
		margin: 40px auto;
	}
	#contact .tel {
		font-size: 25px;
		letter-spacing: 4px;
		margin-bottom: 20px;
	}
	#contact .add {
		letter-spacing: 2px;
	}
	#contact .animation {
		transform: translate(0, -80px);
	}
	#contact .animation .pict12 {
		position: absolute;
		top: 0;
		left: 40px;
		width: 200px;
	}
	#contact .animation .pict13 {
		position: absolute;
		right: 30px;
		top: 0;
		width: 200px;
	}
	#copy {
		margin: 60px 0 30px;
	}
}

/* 〜1279px：小型PC
------------------------------ */
@media screen and (max-width:1279px) {
	body {
		font-size: 14px;
	}
	.pic_ab {
		width: 18%;
	}
	.member-sec .btn_area {
		padding: 0 2.5%;
	}
	.member-sec .movie_wrap {
		padding: 0 2.5%;
	}
}

/* 〜959px：タブレット
------------------------------ */
@media screen and (max-width:959px) {
	body {
		font-size: 12px;
	}
}

/* ～599px：SP横
------------------------------ */
@media screen and (max-width:599px) {
	body {
		padding-top: 90px;
	}
	header .menu_list {
		top: 80px;
	}
	.btn {
		width: 60%;
		margin-left:auto;
		margin-right:auto;
		text-align: center;
	}
	.btn a {
		display: block;
		border: 2px solid #333;
		border-radius: 10px;
		background: #fff;
		line-height: 40px;
		position: relative;
		letter-spacing: 2px;
		transition-duration: .3s;
	}
	.btn a i {
		font-size: 25px;
		display: inline-block;
		vertical-align: middle;
		position: absolute;
		right: 15px;
		top: 8px;
	}
	.btn a:hover {
		background: #333;
		color: #ffe600;
	}
	.maintitle {
		font-size: 20px;
		letter-spacing: 4px;
		font-weight: bold;
		margin-bottom: 20px;
	}
	#header_logo-sp {
		height: 60px;
		padding: 10px 0 10px 20px;
	}
	#header_logo-sp p {
		font-size: 15px;
	}
	#header_logo-sp .box .logo {
		width: 55px;
	}
	#sp_menu {
		padding: 10px;
		width: 40px;
		text-align: center;
		position: absolute;
		top: 8px;
		right: 20px;
		cursor: pointer;
	}
	#sp_menu p {
		margin-top: 15px;
	}
	#sp_menu .bar span {
		display: block;
		width: 100%;
		height: 4px;
		background: #333;
		margin-top: 8px;
		transition-duration: .3s;
	}
	#sp_menu.active .bar span:nth-child(1) {
		transform: rotate(45deg) translate(9px,6px);
	}
	#sp_menu.active .bar span:nth-child(2) {
		transform: translate(50px,0);
		opacity: 0;
	}
	#sp_menu.active .bar span:nth-child(3) {
		transform: rotate(-45deg) translate(11px,-9px);
	}
	#main_text {
		top: 5%;
	}
	#main_text img {
		width: 220px;
	}
	#main_icon {
		max-width: 80px;
		margin: 0 auto -20px;
		transform: translate(0,-40px);
	}
	#policy {
		padding-left: 10px;
		padding-right: 10px;
	}
	#policy h2 {
		margin-bottom: 20px;
	}
	#policy .animation {
		transform: translate(0, -100px);
	}
	#policy p {
		line-height: 2;
	}
	#policy .animation .pict1 {
		position: absolute;
		left: 10px;
		top: 0;
		width: 100px;
	}
	#policy .animation .pict2 {
		position: absolute;
		right: 10px;
		top: 0;
		width: 100px;
	}
	#policy .animation .pict3 {
		position: absolute;
		left: -20px;
		top: 80px;
		width: 100px;
	}
	#policy .animation .pict4 {
		position: absolute;
		right: -20px;
		top: 100px;
		width: 100px;
	}
	#slider .item {
		padding: 5px;
	}
	#slider .item .tl {
		width: 81px;
	}
	#slider .item .tl span {
		font-size: 12px;
		margin-bottom: 5px;
	}
	#slider .item .line {
		padding: 5px;
		font-size: 12px;
	}
	#policy .wave h3 {
		font-size: 16px;
	}
	#policy .btn {
		margin-top: 15px;
	}
	#feature {
		padding: 40px 15px 80px;
	}
	#feature .animation .pict5 {
		position: absolute;
		top: 0;
		left: 0;
		width: 100px;
	}
	#feature .animation .pict6 {
		position: absolute;
		top: 0;
		right: 0;
		width: 100px;
	}
	#feature h2 {
		margin-bottom: 20px;
	}
	#feature ul {
		padding: 0;
	}
	#feature ul li {
		margin: 10px 0;
	}
	#feature ul li a .panel span {
		font-size: 12px;
		padding: 10px 10px 20px;
	}
	#access .animation {
		transform: translate(0, -80px);
		max-width: 1200px;
		margin: 0 auto;
	}
	#access .animation .pict7 {
		position: absolute;
		top: 0;
		left: 0;
		width: 100px;
	}
	#access .animation .pict8 {
		position: absolute;
		top: 0;
		right: 0;
		width: 100px;
	}
	#access .animation .pict9 {
		position: absolute;
		top: 0;
		left: -20px;
		width: 100px;
	}
	#access #map {
		margin: 20px 0;
	}
	#news {
		padding-bottom: 40px;
	}
	#news .animation {
		transform: translate(0, -120px);
		max-width: 1100px;
		margin: 0 auto;
	}
	#news .animation .pict10 {
		position: absolute;
		top: 20px;
		left: 0px;
		width: 120px;
	}
	#news .animation .pict11 {
		position: absolute;
		top: -30px;
		right: 0px;
		width: 130px;
	}
	#news .scroll {
		padding: 10px;
		border-radius: 10px;
	}
	#news dl {
		padding: 5px;
		display: block;
	}
	#news dl dt,
	#news dl dd {
		padding: 3px;
	}
	#news dl dt,
	#news dl dd.cat {
		display: inline-block;
	}
	#news dl dd.cat span {
		font-size: 11px;
		padding: 4px;
	}
	#policy,
	#news,
	#feature,
	#access {
		background-size: 90px auto;
	}
	#contact .animation {
		transform: translate(0, -20px);
	}
	#contact .animation .pict12 {
		position: absolute;
		top: 0;
		left: -20px;
		width: 100px;
	}
	#contact .animation .pict13 {
		position: absolute;
		right: -20px;
		top: 0;
		width: 100px;
	}
	#copy {
		margin-top: 30px;
	}
#line-top {
	height: 5px;
}
	#line-left {
		width: 5px;
	}
	#line-right {
		width: 5px;
	}
	#line-bottom {
		height: 5px;
	}
	.title_area h1 {
		font-size: 24px;
	}
	.title_area p {
		max-width: 160px;
	}
	.member-sec .btn_area {
		display: block;
		max-width: 100%;
		padding: 0;
	}
	.member-sec {
		padding: 10% 2.5% 15%;
		-webkit-background-size: 90px auto;
		-o-background-size: 90px auto;
		background-size: 90px auto;
	}
	.btn-member {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 5%;
	}
	.btn-member:first-child {
		margin-top: 0;
	}
	.member-sec .movie_wrap {
		display: block;
		padding: 0;
	}
	.member-sec .movie_wrap .movie_box {
		width: 100%;
		margin: 10px 0;
		padding: 10px;
	}
}

.captcha {
	text-align: center;
	padding: 20px;
	margin-top: 20px;
}
.captcha .pintitle {
	margin-bottom: 20px;
}

/*201901追加*/
.sp{
	display: none;
}
@media screen and (max-width:599px){
	.sp{
		display: block;
	}
	.pc{
		display: none;
	}
	header{
		z-index: 20;
	}
}