﻿@charset "UTF-8";

@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700);
/*このソフトウェアは、 Apache 2.0ライセンスで配布されている製作物が含まれています。*/

body {
  color: #222f28;
/*  font-family:"游ゴシック体", "Yu Gothic", YuGothic,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
*/	font-family: 'Noto Sans Japanese', sans-serif;
  font-size: 30px; font-style: normal; font-weight: normal; letter-spacing: 0.03em;
  text-decoration: none; -webkit-text-size-adjust: 100%; 
}

html, body {  overflow-x: hidden;}
a:hover, a:hover img {  filter: alpha(opacity=70);  -moz-opacity:0.70;  opacity:0.70;}

img { vertical-align: bottom;}
.pc { display:block;}
.sp { display:none;}

.clearfix:after { content: ""; clear: both; display: block;}
p#page-top ~ img { position:absolute; left:0; bottom:1; height:1px; width:1px;}
/*カラー ------------------------------------------------------------------------------*/

header { background-color:#fff;}
.news, .news a{ background-color:#359fd8;color:#fff;}
footer { background-color:#333; color:#fff;}
a, 
.price div,.red  { color:#e65d7a;}
.price a h2 { color:#111;}
.price a p { color:#111;}
footer a { color:#fff;}

nav ul li:last-child a {background-color:#3896ca !important;}


/* 見出し・本文 ------------------------------------------------------------------------------*/

h1,
h2 { font-size:36px; text-align:center; line-height:150%; margin-bottom:40px;}
h3 { font-size:44px; text-align:center; line-height:150%; margin-bottom:40px;}
h4 { font-size:28px; text-align:center; line-height:150%;}
p { font-size:18px; line-height:160%; margin-bottom:1em;}

header h1 { font-size:10px; text-align:left; line-height:100%; margin-bottom:0;}

header { position: relative;}
section { width:94%; max-width:1280px; margin:0 auto 80px auto;}
header section { width:96%; max-width:1280px; margin:0 auto; padding:0px 0 20px 0;}

.news { width:100%; max-width:none; height:40px; margin-bottom:0px;font-size:18px; }
.news div { width:96%; max-width:1280px; margin:0 auto; padding-top:10px; position:relative;}
.news dt { clear:both; float:left;}
.news dd { float:left;}
.news dt { margin-right:1em;}
.news a.new  {position:absolute; right:0; top:10px;}

.price li { width:31.25%; margin-right:3.125%; margin-bottom:20px; float:left;}
.price li:nth-child(3) { margin-right:0; }
.price img {margin-bottom:10px;}
.price h2 { font-size:24px; text-align:left; line-height:150%; position:relative;}
.price h2 span{ font-size:13px; margin-left:0.3em;}
.price div { position:absolute; right:0; top:0;}

.step li { width:25%; margin-right:0px; float:left;}
.step li:last-child{margin-bottom:40px;}

footer h3 {font-size:28px; text-align:left; line-height:150%; margin-bottom:40px;}
footer section { padding:40px 0 60px 0; margin-bottom:0;}
footer ul {position: relative;left: 50%;float: left; font-size:14px; margin-bottom:40px;}
footer li {position: relative;left: -50%; float: left; border-right:1px solid #616161; margin-right:10px; padding-right:10px; margin-bottom:10px;}
footer li:last-child{ margin-right:0;border-right:none;}

#fnews { width:65.625%; margin-right:3.125%; float:left; line-height:150%; font-size:16px; }
#fnews div { width:1280px; margin:0 auto; padding-top:10px; position:relative;}
#fnews dt { clear:both; float:left; margin-right:1em; font-weight:bold;}
#fnews dd { float:left;}
#snslink { width:31.25%;float:left;}
#snslink img{padding-bottom:20px; }
#snslink a:nth-child(1) { margin-right:20px; }
#copy { font-size:12px; text-align:center; padding:10px; background-color:#444; color:#fff; }


/* トップ以外 ------------------------------------------------------------------------------*/



.lnk { text-align:right;}
.news li { float:left; margin-right:20px;}

.main { position:relative; overflow:hidden;}
.main > div {position:absolute; left:70px; bottom:30px; color:#fff;}
.main p.title {font-size:64px; text-align:left; font-weight:bold; margin-bottom:0.3em;}
.main p.txt {width:60%;}
.main ul {margin-bottom:0.8em;}
.main li {margin-bottom:0.2em;}
.gray > div {color:#333;}

.two div h2 { font-size:24px; border-bottom:2px solid #359fd8;  color:#359fd8; padding:0.3em 0; text-align:left;

	}
.two div{ width:48.6979%; margin-right:2.6042%; float:left;}
.two div:nth-child(2n+0) { margin-right:0;}
.two div p { margin-bottom:1em;}

table { width:100%; border-top: 1px solid #e6e8df;}
th,
td { font-size:18px; padding:16px 0px; text-align:left;}
tr { border-bottom:1px solid #e6e8df;}
th { width:30%; font-weight:bold;}
.two li { width: 48.6979%; margin-right:2.6042%; float:left; margin-bottom:20px;}
.two li:nth-child(2n+0) { margin-right:0;}


/*			.footermenu div h2 { font-size:24px;  background-color:#e6e8df; padding:0.5em;}
			.footermenu div{ width:100%; margin-right:2.6042%; float:left;}
			.footermenu div:nth-child(2n+0) { margin-right:0;}
			.footermenu div p { margin-bottom:1em;}
			
			.footermenu div table { width:100%; border-top: 1px solid #e6e8df;}
			.footermenu div th,
			.footermenu div td { font-size:18px; padding:10px; text-align:left;}
			.footermenu div tr { border-bottom:1px solid #e6e8df;}
			.footermenu div th { width:30%; font-weight:bold;}
			.footermenu li { width: 80%; margin-right:2.6042%; float:left; margin-bottom:20px;}
			.footermenu li:nth-child(2n+0) { margin-right:0;}
			
			.footerpriv div h2 { font-size:24px;  background-color:#e6e8df; padding:0.5em;}
			.footerpriv div{ width:100%; margin-right:2.6042%; float:left;}
			.footerpriv div:nth-child(2n+0) { margin-right:0;}
			.footerpriv div p { margin-bottom:1em;}
			
			.footerpriv div table { width:100%; border-top: 1px solid #e6e8df;}
			.footerpriv div th,
			.footerpriv div td { font-size:18px; padding:10px; text-align:left;}
			.footerpriv div th { width:100%; font-weight:bold;}
			.footerpriv li { width: 80%; margin-right:2.6042%; float:left; margin-bottom:20px;}
			.footerpriv li:nth-child(2n+0) { margin-right:0;}
			
			.footerkiyaku div h2 { font-size:24px;  background-color:#e6e8df; padding:0.5em;}
			.footerkiyaku div{ width:100%; margin-right:2.6042%; float:left;}
			.footerkiyaku div:nth-child(2n+0) { margin-right:0;}
			.footerkiyaku div p { margin-bottom:1em;}
			
			.footerkiyaku div table { width:100%; border-top: 1px solid #e6e8df;}
			.footerkiyaku div th,
			.footerkiyaku div td { font-size:18px; padding:10px; text-align:left;}
			.footerkiyaku div tr { border-bottom:1px solid #e6e8df;}
			.footerkiyaku div th { width:10%; font-weight:bold;}
			.footerkiyaku li { width: 80%; margin-right:2.6042%; float:left; margin-bottom:20px;}
			.footerkiyaku li:nth-child(2n+0) { margin-right:0;}*/
			
	
#page a.btn { font-size:22px; font-weight:bold; padding:30px 0px; line-height:100%; margin-bottom:0px; background-color:#e65d7a; color:#fff; -moz-border-radius: 8px;-o-border-radius: 8px;-webkit-border-radius: 8px;	border-radius: 8px;}
#page h1 a.btn {position:absolute; right:0; top:0; display:block;}
#page a.btn {position:static; right:0; top:0; display:block; text-align:center;}
#page #snslink { clear:both; width:90%;float:none;padding:20px; text-align:center; margin:0 auto;}
#page footer section { padding:50px 0 40px 0;}


/* .other h1 { padding-top:40px;} */

.other select,
.other input,
.other textarea { padding:0.5em; min-width:300px; margin:0;}
.other table span { font-size:85%; margin-left:0.2em;}
.other p.f16 {margin:20px 0px 20px 0px;font-size:16px; font-weight:bold;}
.other table p {margin-bottom:0;font-size:80%;}
.other .submit { padding:16px 0; font-size:20px; font-weight:600; font-family: 'Noto Sans Japanese', sans-serif; width:100%; max-width:380px;letter-spacing: 0.2em; background-color:#e65d7a; color:#fff; border:none; -moz-border-radius: 8px;-o-border-radius: 8px;-webkit-border-radius: 8px;	border-radius: 8px;}
.other .submit:hover { filter: alpha(opacity=70);  -moz-opacity:0.70;  opacity:0.70;}

.other div.haba { padding:0.5em; margin:0; text-align:left !important;}
.other div.haba2 { width:50% !important; margin:0; text-align:left !important;}
.other label input.doui { padding:0.5em; min-width:40px !important; margin:0; text-align:left !important;}

.other table {line-height:0.8em;}
.other table th {vertical-align:top; width:28%; position:relative;}
.other table th > div { position:absolute; top:16px; font-size:80%; right:12px; padding:5px; font-weight:normal; background-color:#e65d7a; color:#fff; -moz-border-radius: 4px;-o-border-radius: 4px;-webkit-border-radius: 4px;	border-radius: 4px;}
.other textarea { width:90%; min-height:5em;}

.other ol, .other .waku p {list-style-type: decimal; margin-left:1em; padding:1em; padding-bottom:0; font-size:14px; line-height:1.5em; }
.other ol li { float:none; width:auto; margin-right:0; margin-bottom:1em;}
.other .waku {border:2px solid #e6e8df; padding:1em; margin-bottom:1em;}

.other dl {margin-left:1em; padding:1em; font-size:14px;line-height:1.5em;}
.other dl dt {display: list-item; list-style-type: decimal; font-weight:bold; margin-bottom:0.2em;}
.other dl dd { margin-bottom:1em;}

input[type="button"],input[type="submit"] {-webkit-appearance: none;}

.attention{
	border: solid;
border-color: #f00;
	color: #f00;
	width: 70%;
    margin: 0 auto;

}

.attention h2{
	font-size:80%;
}

.attention p{
	width:90%;
	margin:0 auto;
}

.other .table2 th{
	vertical-align: top;
    width: 30%;
	
}

.other .table2 th img{
	max-width:100%;
	max-height:250px;
	
}

.other .table1 span { font-size:75%; margin-left:0.2em;}


.accordion p{
	cursor: pointer
}
.accordion ul{
	display:none;
}


.submit_signup1 { padding:16px 0; font-size:20px; font-weight:600; font-family: 'Noto Sans Japanese', sans-serif; width:100%; max-width:380px;letter-spacing: 0.2em; background-color:#359fd8; color:#fff; border:none; -moz-border-radius: 8px;-o-border-radius: 8px;-webkit-border-radius: 8px;	border-radius: 8px; margin:0 auto;}

.submit_signup2 { padding:16px 0; font-size:20px; font-weight:600; font-family: 'Noto Sans Japanese', sans-serif; width:100%; max-width:380px;letter-spacing: 0.2em; background-color:#e65d7a; color:#fff; border:none; -moz-border-radius: 8px;-o-border-radius: 8px;-webkit-border-radius: 8px;	border-radius: 8px; margin:0 auto;}

summary {
  display: block;
  cursor: pointer;  
}

/* Chrome、Safari */
summary::-webkit-details-marker {
  display: none;
}


/* オープン時にアニメーションを設定 */
details[open] .details-content {
  animation: fadeIn 0.5s ease;
}
@keyframes fadeIn {
  0% {
    opacity: 0; /* 透明 */
    transform: translateY(-10px); /* 上から表示 */
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

/* 汎用クラス ------------------------------------------------------------------------------*/

.mb20 { margin-bottom:20px;}
.mb40 { margin-bottom:40px;}
.mb60 { margin-bottom:60px;}
.mb80 { margin-bottom:80px;}
.mb100 { margin-bottom:100px;}
.txtc{ text-align:center;}
.txtl{ text-align:left;}
.txtr{ text-align:right;}
.txt666 ,.gray{color:#666;}

.p10 { padding:10px;}
.p20 { padding:20px;}
.p30 { padding:30px;}

.blue { color:#32b5dd;}
.red_p { color:#e65d7a;}
.f14 { font-size:14px;}
.f16 { font-size:16px;}
.f18 { font-size:18px;}
.f_futo { font-weight:bold}



/* 2022年度 追加（木下）------------------------------- */
.cont {
	margin-top: 90px;
}

.benefits {
	text-align: center;
}

.detail {
	margin-top: 120px;
}

.f20 {
	font-size: 20px;
	margin-bottom: 0px;
}

.blue {
	margin-bottom: 90px;
}

/* 2022年度 追加（木下）ここまで------------------------------- */

/* pagetop */

/* IE */
@font-face {
	font-family: iconfont;
	src: url(CONDENSEicon.eot);
}
/* Firefox, Opera, Safari */
@font-face {font-family: iconfont;src: url(./CONDENSEicon.otf) format("truetype");}
.icon {	font-family: iconfont;font-weight: normal;}
.icon-pagetop:before {content: "ü";}
#page-top {	position: fixed;bottom: 20px;right: 20px;	font-size: 77% !important;}
#page-top a {	background: #333;	text-decoration: none;	color: #fff;width: 40px;	height:40px;	padding:0;	line-height:1.7em;
	text-align: center;	display: block;	border-radius: 5px;	-webkit-border-radius: 5px;	-moz-border-radius: 5px;	zoom:1;}
#page-top a:hover {	text-decoration: none;	background: #999;}

@media screen and (max-width:  1279px) {
	section.main { width:100%; }
	.main p.title {font-size:60px; margin-bottom:0.1em;}
}


@media screen and (max-width:  979px) {
	section { margin-bottom:40px;}
	.news div { padding-top:12px;}
	.news a.new  {top:12px;}
	.img_center{margin:30px auto 30px; width:80%;}
			
	h1,.other h1,
	h2 { font-size:32px;margin-bottom:20px;}
	h3 { font-size:26px;margin-bottom:20px;}
	h4,footer h3 { font-size:24px;}
	p, th, td,.news  { font-size:14px;}
	.price h2 { font-size:22px; }
	.two div h2 { font-size:22px; padding:0.4em;}
	.price div { position:static; text-align:right;}
	
	.main > div {left:50px; bottom:20px;}
	
	.other table th {width:34%;}
}

@media screen and (max-width: 767px) {
	section { margin-bottom:20px;}
	.news div { padding-top:14px;}
	.news a.new  {top:14px;}
	
	h1,.other h1,
	h2 { font-size:28px;margin-bottom:20px;}
	h3 { font-size:26px;margin-bottom:20px;}
	h4{ font-size:26px;}
	p, th, td,.news  { font-size:13px;}
	.price h2 { font-size:20px; }
	.price li { width:48%;  margin-bottom:20px; float:left;}
	.price li:nth-child(2n+0){ margin-right:0; }
	.price li:nth-child(1n+0){ margin-right:2%;}
	.step li:last-child{margin-bottom:20px;}
	
	header section, header section, header h1,header h2,footer h3 {text-align:center;}
	#fnews { clear:both; width:90%; margin-right:0; float:none; line-height:150%; font-size:14px;padding:20px;}
	#fnews dt { clear:both; float:none; margin-right:1em;}
	#fnews dd { float:left;}
	#snslink { clear:both; width:90%;float:none;padding:20px; text-align:center;}
	#snslink a:nth-child(1) { margin-right:20px; }
	
	footer section,
	#page footer section { padding:10px 0 20px 0;}
	footer ul {position: relative;left:auto;float:none; font-size:13px; margin-bottom:0px; background-color:#555; color:#111;	
							-moz-border-radius: 8px;-o-border-radius: 8px;-webkit-border-radius: 8px;	border-radius: 8px;}
	footer li {position: relative;left:auto; float: none; margin-right:0px;color:#111; border:none; margin-bottom:0; border-bottom:1px solid #333;}
	footer li:last-child{ margin-right:0;}
	footer li a { display:block; padding:1em; }
	
	.main > div {left:30px; bottom:16px;}	
	.main p.title {font-size:44px; margin-bottom:0.1em;}
	.main ul{font-size:18px;}
	.main p.txt {width:54%;}

	.two div{ width:100%; margin-right:0; float:none; margin:0 auto; }
	.two div h2 { font-size:18px; padding:0.4em;}


.attention{
	width: 100%;
}


	#page a.btn { line-height:160%; font-size:20px;}
	
	.other table th{ padding-bottom:0; font-size:15px;}
	.other select,
	.other textarea { width:90%; min-width:100px;}
	.other input.area_radio　{ width:90%; min-width:80px;}
	.area_text　{ width:90% !important; min-width:100px !important;}
	.other label input.doui { padding:0.05em; min-width:18px !important; margin:0; text-align:left !important;}
	.other ol, .other .waku p,.other dl {margin-left:1.6em; padding:0.5em; font-size:13px;}
	.other .waku {padding:0.8em;}
	
	.other .table1 th, .other .table1 td {width:100%; display:block;}

		/* 2022年度 追加（木下） -------------*/
	.benefits_contents {text-align: center;}
	.f20 {font-size: 16px;}
		/* 2022年度 追加（木下） ここまで -----*/

}

@media screen and (max-width: 479px) {
	.pc { display:none;}
	.sp { display:block;}
	
	h1,.other h1,
	h2 { font-size:18px;margin-bottom:10px;}
	h3 { font-size:18px;margin-bottom:10px;}
	h4,footer h3 { font-size:20px;}

	.news a.new  { display:none;}
	header section img { width:40%;}
	p, th, td,.news  { font-size:14px;}
	.price h3 { font-size:16px; }
	.step li { width:50%; margin-right:0px;}
	.two li { float:none; width:100%; margin-bottom:10px;}
	

	#fnews { font-size:13px;}
	#snslink img { width:50px;}

	.main > div {left:20px; bottom:16px;}	
	.main p.title {font-size:22px;}
	.main ul{font-size:14px; margin-bottom:0;}
	.main p.txt {width:54%; display:none;}

	
	#page .price li { width:100%;  margin-bottom:20px; float:none; text-align:center;}
	#page .price li p {text-align:left;}
	#page .price li:nth-child(2n+0){ margin-right:0; }
	#page .price li:nth-child(1n+0){ margin-right:0;}
	
	#page a.btn { line-height:160%; font-size:16px;}
	
	/* .other h1 { padding-top:20px;} */
	/* .other h2 { padding-top:20px;} */

	
	.other ol, .other .waku p,.other dl {margin-left:1.6em; padding:0; font-size:12px;}
	.other .waku {padding:0.5em;}

	/* 2022年度 追加（木下）--------------- */
	.benefits {font-size: 18px;}
	.benefits_contents {text-align: center;}
	.detail {margin-top: 90px;}
	.f20 {font-size: 14px;}
	.cont {margin-top: 0px;}
	/* 2022年度 追加（木下） ここまで--------*/
}