@charset 'UTF-8';

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,
form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,
sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline;
}
* {
    box-sizing: border-box;
}
img {
    max-width: 100%;
    height: auto;
    border: none;
    vertical-align: bottom;
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section {
    display: block;
}

html{
	font-size:calc(5vw);
	font-size:-webkit-calc(5vw);
}
@media (min-width: 750px){html{font-size:37.5px}}

body{
	position:relative;
	width:100%;
	max-width:1920px;
	min-width:320px;
	-webkit-text-size-adjust:100%;
	font-family:'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3','Meiryo', 'メイリオ', sans-serif;
	margin:0 auto;
}

ol,ul {
    list-style: none;
}
a,
a:hover {text-decoration: none;}

img {display:block;width:100%;height:auto}
.image{font-size:0;line-height:1;}
strong {font-weight:bold;}

/* layout css */
.sponly{display:block;}
.pconly{display:none;}
.inner {margin:0 4%;}
.inner-on {padding:0 3.8%;}
.cvarea {padding-bottom:10%;}
.cvarea > ul li:first-child {
	margin-bottom:4%;
}
#nav {
	padding:0 2% 4%;
	background-color:#fffbed;
}
#nav li{
	float:left;
	width:32%;
	margin-right:2%;
}
#nav li:last-child {
	margin-right:0;
}

#header {
	background-color:#FFF;
}
p.logo {
	float:left;
	width:22.2%;
	padding:1.2% 0;
}
p.logo img {
	width:51%;
	margin:0 auto;
}
#topnav {
	width:77.8%;

	float:left;	
}
#topnav > li {
	float:right;
	width:50%;
} 

#topnav2 {
	width:77.8%;
	float:left;	
}
#topnav2 > li {
	float:right;
	width:50%;
} 

#seminar {
	padding-top:4%;
	background-color:#fffbed;
	text-align:center;
}

#seminar .txt1{
	width:67.7%;
	margin:0 auto;
}
#seminar .txt2 {
	width:84.9%;
	margin:4% auto;
}
#seminar ul.lists {
	padding:0 2% 5% 2%;
}
#seminar ul.lists > li{
	font-size:4.6vw;
	text-align:left;
	padding-left:5%;
	color:#00689b;
	position:relative;
	margin-bottom:0.5%;
}
#seminar ul.lists > li:before {
	content:"・";
	position:absolute;
	left:0;
}
#seminar ul.lists > li:last-child {
	margin-bottom:0
}
#seminar p.txt3 {
	font-size:4.5vw;
	text-align:center;
	color:#00689b;
}
#seminar p.txt3 span {
    display: block;
    font-size: 3.7vw;
    margin-bottom: 7%;
}
#seminar p.anno {
	font-size:3.6vw;
	text-align:left;
	color:#00689b;
	padding-bottom:4%;
}

h2 {
	margin:0 auto 7%;
	background-image:url(../images/h2_bg.jpg);
	background-repeat:repeat;
	background-position:center top;
	background-size:contain;
}
h2 span {
	display:block;
	padding:5% 0;
	position:relative;
	background-image:url(../images/h2_icon.png);
	background-position:right center;
	background-size:auto 76%;
	background-repeat:no-repeat;
}

h2 img {margin:0 auto;}

#attr h2 img {width:65%;}
#voice h2 img {width:41.3%;}

#reason h2 img {width:61.7%;}
#reason h2 span {
	padding:2% 0;
}
#attr {
	background-color:#def3ff;
	color:#00689b;
}
#attr h3 {
	position:relative;
	padding-bottom:3%;
	margin-bottom:7%;
}
#attr h3.ttl2.two {
	margin-bottom:10%;
}
#attr h3:after {
    height: 12%;
    width: 100%;
    content: "";
    background-color: #00689b;
    position: absolute;
    bottom: 0;
}
#attr h3.two:after {
	height:7%;
}
#attr h3 img{margin:0 auto;}
#attr h3.ttl1 img{width:60.2%;}
#attr h3.ttl2 img{width:90.8%;}

#attr p.txt1 {
	font-size:4.1vw;
	margin-bottom:6%;
}
#attr .img1 {
	width:94.6%;
	margin:0 auto 8%;
}
.case .ttl1 {
	width:88.4%;
	margin-bottom:1%;
}
.case .ttl2 {
	width:90%;
	margin-bottom:1%;
}
.case .ttl3 {
	width:89.7%;
	margin-bottom:1%;
}
.case .ttl4 {
	width:85.5%;
	margin-bottom:1%;
}
.case .images {
	margin-bottom:4%;
}
.case .txt {
	font-size:4vw;
	margin-bottom:10%;
}
.case .txt span {
	color:#ec5125;
}
#reason {
	background-color:#fffbed;
}

#reason .bg{
	position:relative;
	background-color:#def3ff;
}
#reason .bg:after {
	content:"";
	display:block;
	background-image:url(../images/reason_arrow.png);
    background-position: center top;
    background-size: auto 80%;
    background-repeat: no-repeat;
    padding-bottom: 10%;
    position: relative;
    background-color: #fffbed;
}
#reason dl {
	position:relative;
	background-color:#FFF;
	padding:4% 7%;
}
#reason dt {
	position:relative;
	display:block;
	text-align:center;
	color:#00689b;
	font-weight:bold;
	font-size:5.5vw;
	padding-bottom:3%;
	margin-bottom:8%;
	line-height:1.5;
}
#reason dt:after {
    height: 10%;
    width: 100%;
    content: "";
    background-color: #def3ff;
    position: absolute;
    bottom: 0;
    left:0;
}
#reason dt span {
	position:absolute;
	width:4.75rem;
	top:-70%;
	left:-15%;
	z-index:20;
}
#reason dl {
	box-shadow:10px 10px 0px #c8dfef;
	margin-bottom:7%;
}
#reason .txt {
	font-size:4.9vw;
	color:#00689b;
	position:relative;
	line-height:1.5;
	min-height:70px;
}
#reason .txt strong {
	font-size:5.8vw;
	color:#ec5125;
	font-weight:normal;
}
#reason .txt sup {
	font-size:4.5vw;
}
#reason .txt span {
	position:realtive;
	font-size:3.6vw;
	display:block;
	margin-top:2%;
}
#reason dl:last-child dt {
	padding-left:15%;
}

#reason .catch > p{
	width:97.7%;
	margin:0 auto;
	padding-bottom:6%;
}
#voice {
	background-color:#fffbed;
}
#voice ul.comm li {
    background-size: contain;
    background-position: left bottom;
    background-repeat: no-repeat;
    width: 96%;
    position:relative;
    margin-bottom:6%;
}
#voice ul.comm li:nth-child(1) {
	background-image:url(../images/voice1.png);
	padding:20% 0;
}
#voice ul.comm li:nth-child(2) {
	background-image:url(../images/voice2.png);
	padding:28.2% 0;
	margin-left:4%;
}
#voice ul.comm li:nth-child(3) {
	background-image:url(../images/voice3.png);
	padding:16.9% 0;
}
#voice ul.comm li:nth-child(4) {
	background-image:url(../images/voice4.png);
	padding:27.6% 0;
	margin-left:4%;
}
#voice ul.comm li span.txt {
    position: absolute;
    width: 60%;
    right: 3%;
    font-size: 4.9vw;
    color: #0087af;
    top: 13%;
}
#voice ul.comm li:nth-child(even) span.txt {
	left:5%;
	top:10%;
}
#voice ul.comm li:nth-child(3) span.txt {
	top:15%;
}
#voice ul.comm li span.profile {
    position: absolute;
    right: 7%;
    bottom: -9%;
    width: 24.2%;
}
#voice ul.comm li:nth-child(even) span.profile {
	left:37%;
	bottom:-6%;
}

#voice p.anno {
	color:#00689b;
	font-size:3.6vw;
	padding:4% 0 7%;
}

#footer {
	background-image:url(../images/footer_bg_sp.jpg);
	background-position:center top;
	background-size:contain;
	padding-top:28.4%;
	background-repeat:no-repeat;
}

#tel {
	background-color:#def3ff;
	padding:4% 0 5%;
}
#tel dt {
	display: block;
    width: 83.7%;
    margin: 0 auto 3%;
}
#tel dd.num {
	width:99.5%;
	margin:0 auto 2%;
}
#tel dd.time {
	margin:0 -1.1%;
}

#foot {
	padding:6% 0 0;
}
#foot .footer-logo {
	width:34%;
	margin:0 auto 6%;
}
#foot .links {
	background-color:#def3ff;
	padding:4% 0 4%;
}
#foot .links ul{
    width: 62%;
    font-size: 3.2vw;
    margin:0 auto;
}
#foot .links ul li {
	float: left;
    line-height: 1;
    white-space: nowrap;
}
#foot .links ul li:first-child {
    margin-right: 5%;
    padding-right: 5%;
    border-right: 2px solid #00689b;
}
#foot .links ul li a {
	color:#00689b;
	text-decoration:none;
}
#foot .copy {
	background-color:#00689b;
	color:#FFF;
	text-align:center;
	font-size:2.4vw;
	padding:4% 0;
}
.snsBtn {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
	margin:0 4% 5%;

}
.snsBtn li {
    margin: 0 4.6% 0 0;
    align-items: center;
    width:11.7%;
}
.snsBtn li:last-child {
	margin-right:0;
	width:50.4%;
}

#page_top {
    display: none;
    position: fixed;
    z-index: 9999;
    bottom: 10px;
    right: 10px;
    width: 3.6rem;
    cursor:pointer;
}

/* media query 768 */
@media print,
screen and (min-width:768px) {
	.sponly{display:none;}
	.pconly{display:block;}
	a img:hover {opacity:.75;}
	.inner {
		margin:0 auto;
		padding:0 3.2%;
	}
	.inner-on {
		padding:0 4.8%;
	}
	.outer {
		max-width:980px;
		padding:0 10px;
		margin:0 auto;
	}
	.cvarea.inner {padding:0 3.2% 7%;}
	.cvarea li{
		float:left;
		width:100%;
	}
	.cvarea > ul li:first-child {
		margin: 0 2% 0 0;
	}
	#nav {padding:0 2% 30px;}
	#nav ul {padding:0 8.5%;}
	
	h2 {margin-bottom:50px;}
	h2 span.outer {display:block; padding:35px 10px;}
	h2 span {background-position:right 10px center;background-size:auto 86%;}
	#attr h2 img {padding:0 7%;width:65.1%;}
	#reason h2 img {padding:0 7%;width:61.3%;}
	#voice h2 img {padding:0 4.5%;}

	#reason h2 span {background-size:auto 70%;}

	#header {
		padding:1% 0;
	}
	p.logo {
		padding:0;
		width:7.2%;
	}
	p.logo img{
		max-width:85px;
		width:100%;
	}
	#topnav {
		width:80%;
		float:right;
	}
	#topnav > li {
		max-width:380px;
		width:49.5%;
	}
	#topnav > li:first-child {
		margin-right:1%;
	}
	
		#topnav2 {
		width:80%;
		float:right;
	}
	#topnav2 > li {
		max-width:380px;
		width:49.5%;
	}
	#topnav2 > li:first-child {
		margin-right:1%;
	}
	#mv .bg{
		position:relative;
		background-image:url(../images/mv_bg.jpg);
		background-size:cover;
		background-position:center center;
		background-repeat:no-repeat;
		background-color:#fffbed;
	}
	#mv h1 {
		position:relative;
		max-width:791px;
		margin:0 auto;
		width:82.4%;
	}
	.mvimg {
		width: 59.9%;
		max-width:575px;
	    margin: -7.5% auto 0;
	    position: relative;
	}
	.mvimg2 {
	    margin: -1.3% auto 0;
	    width: 84.4%;
	    max-width:810px;
	    position: relative;
	    padding-bottom:9.2%;
	}
	#seminar {
		padding-top:25px;
	}
	#seminar .txt1 {
		width:48%;
		padding-bottom: 50px;
		max-width:456px;
	}
	#seminar .txt2 {
		margin:25px auto 25px;
		max-width:787px;
	    width: 83%;
	}
	#seminar ul.lists {
		padding:0 5% 4%;
	}
	#seminar ul.lists > li {
		font-size:2.9vw;
		padding-left:25px;
		margin-bottom:1.6%;
	}
	#seminar p.txt3 {
		font-size:2.9vw;
		padding:0 5%;
		margin-bottom:4%;
	}
	#seminar p.txt3 span {
		display:inline;
		font-size:1.7vw;
	}
	#seminar p.anno {
		font-size:1.7vw;
		padding:0 6%;
		margin-bottom:3%;
	}
	
	#attr h3 {margin-bottom:5%;}
	#attr h3:after,#attr h3.two:after {height:8px;}
	#attr h3.ttl1 img {
		padding:0 6.4%;
		width:60.1%;
	}
	#attr h3.ttl2 img {
		padding:0 9.8%;
		width:90.9%;
	}
	#attr p.txt1 {font-size:2.9vw;}
	#attr .img1 {padding:0px 12.8%;width:94.7%; }
	
	.case .ttl1 {width:75.5%;}
	.case .ttl2 {width:76.7%;}
	.case .ttl3 {width:76.5%;}
	.case .ttl4 {width:73.2%;}
	.case .txt {font-size:2.9vw;}
	#reason dt span {width:23%;}
	#reason dt {font-size:4.8vw;margin-bottom:5%;}
	#reason dd.txt {font-size:2.9vw;}
	#reason dd.txt strong{font-size:2.9vw;}
	#reason dd.txt sup{font-size:2vw;}
	#reason dd.txt span {position:relative;text-align:left;display:block;font-size:1.7vw;}
	#reason dl:last-child dt {padding-left:0;}
	#reason .bg:after {background-size:400px auto;padding-bottom:110px;}
	
	#reason .catch > p {padding: 0 10.7% 3%;width: 97.8%;}
	#voice ul.comm li:nth-child(1) {width: 70%;padding: 14.7% 0;margin:0 auto 6%;}
	#voice ul.comm li:nth-child(2) {width: 70%;padding: 20.6% 0;margin:0 auto 6%;}
	#voice ul.comm li:nth-child(3) {width: 70%;padding: 12.3% 0;margin:0 auto 6%;}
	#voice ul.comm li:nth-child(4) {width: 70%;padding: 20.1% 0;margin:0 auto 6%;}
	
	#voice ul.comm li span.txt {font-size:3.4vw;}
	#voice ul.comm li span.profile {width:25.9%;}
	#voice p.anno {font-size:1.7vw;padding:0% 0 4%;margin:0 auto;width:70%;}

	#footer {
		background-image:url(../images/footer_bg_pc.jpg);
		background-position:center top;
		background-size:100% auto;
		padding-top:21.8%;
	}

	#tel {padding:30px 0 50px;}
	#tel dt {width: 61.1%;}
	#tel dd.num {width:72.6%;}
	#tel dd.time {width: 74.5%;margin: 0 auto;}
	#foot {padding-top:30px;}
	#foot .footer-logo {width:26.6%;margin-bottom:4%;}
	#foot .links {padding:40px 0;}
	#foot .links a:hover {text-decoration:underline;}
	#foot .links ul {width: 48%;font-size: 2.1vw;margin: 0 auto;}
	#foot .copy {padding:40px 0; font-size: 2.1vw;}
	.snsBtn {margin-bottom:30px;}
	.snsBtn li {width:8.5%;}
	.snsBtn li:last-child {width:36.8%;}
	#page_top {width:100px;}

}/* media end */
/* media query 768 */
@media print,
screen and (min-width:980px) {
	#seminar ul.lists > li{	font-size:28px;}
	#seminar p.txt3 {font-size:28px;}
	#seminar p.anno {font-size:15px;}
	#seminar p.txt3 span{font-size:18px;}
	#attr p.txt1 {font-size:28px;}
	.case .txt {font-size: 28px;}
	
	#reason dl {padding:3% 7%;}
	#reason dt{font-size:48px;}
	#reason dd.txt{font-size:28px;}
	#reason dd.txt strong {font-size:32px;}
	#reason dd.txt sup{font-size:24px;}
	#reason dd.txt span{font-size:15px;}
	
	#foot .links ul {font-size:21px;}
	#foot .copy {font-size:21px;}
	#voice ul.comm li span.txt {font-size:34px;}
	#voice p.anno {font-size:15px;}


}

.inner.cvarea {
	text-align: center;
}
.inner.cvarea ul {
	width: 49%;
	margin: 0 auto;
}

/* clearfix */
.clearfix:after {  
  content: ".";   
  display: block;   
  height: 0;   
  clear: both;   
  visibility: hidden;  
}  
  
.clearfix { display: inline-table; }  
  
/* Hides from IE-mac \*/  
* html .clearfix { height: 1%; }  
.clearfix { display: block; }  
/* End hide from IE-mac */