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

body{
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
line-height:1.7;
word-break: normal;
word-wrap: break-word;
}

.ss{
	font-size:xx-large;
}

.sa{
	font-weight : 900;
	text-decoration : underline;
}

img{
border: 0;
vertical-align: bottom;
max-width:100%;
height:auto;
-ms-interpolation-mode: bicubic;
}

ul, li, dl, dt, dd { list-style: none; }
strong { font-weight: bold;}
a:link{color:blue; text-decoration:underline;}
a:visited{color:blue; text-decoration:underline;}
a:hover{color:orange; text-decoration:underline;}

a:hover img{
opacity:.6;
}

.fl{float: left;}
.fr{float: right;}
.ac{text-align: center;}
.al{text-align: left;}

.fs100{font-size:100% !important;}



/*PC用
────────────────────────────────────*/
.header {
width:1200px;
margin:0 auto;
padding: 10px 0;
overflow: hidden;
}

.linkRight {
float: right;
text-align: right;
}

#nav{
	list-style: none;
	position: fixed;
	top:410px;
	right: 20px;
}

#nav li{
margin: 0 0 15px 0;	
}

#nav li a{
display: inline-block;
width:14px;
height: 14px;
border-radius: 50%;
background:#fff;
box-shadow:0 0 1px #000;
}

#nav li a.active{
background:#13BF78;
box-shadow:none;
}


h2{
width:100%;
text-align: center;
margin-bottom: 80px;
}

p{
margin-bottom: 1.9em;
}




.btn{
display: inline-block;
width:400px;
margin:0 0 20px 0;
padding:15px 0;
font-weight: bold;
text-decoration: none !important;
text-align: center !important;
background: #fff;
text-transform: uppercase;
position: relative;
overflow: hidden;
z-index: 1;
-webkit-transition: color 150ms ease-in-out;
transition: color 150ms ease-in-out;
}

.btn:first-child{
margin:0 100px 20px 0;
}

.meeting:link{color: #13BF78;}
.meeting:visited{color: #13BF78;}
.meeting:hover{color: #fff;}
.meeting:active{color: #fff;}

.meeting{
color: #13BF78;
border: 2px solid #13BF78;
}

.meeting:hover:after {
width: 110%;
}

.meeting:after {
content: '';
position: absolute;
display: block;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 0;
height: 100%;
background: #13BF78;
z-index: -1;
-webkit-transition: width 150ms ease-in-out;
transition: width 150ms ease-in-out;
}

.online:link{color: #029FEC;}
.online:visited{color: #029FEC;}
.online:hover{color: #fff;}
.online:active{color: #fff;}

.online{
color: #029FEC;
border: 2px solid #029FEC;
}

.online:hover:after {
width: 110%;
}

.online:after {
content: '';
position: absolute;
display: block;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 0;
height: 100%;
background: #029FEC;
z-index: -1;
-webkit-transition: width 150ms ease-in-out;
transition: width 150ms ease-in-out;
}

.toContact{
display: inline-block;
color: #3DB680 !important;
}

.toContact:hover{
opacity: .7;
}



#intro{
width: 100%;
height: 1500px;
padding:40px;
background:#fff url(images/bg1.png) no-repeat fixed;
background-position:right center !important;
background-size:contain;
}

.inner{
width:1200px;
margin:0 auto;
}

#intro h2{
text-align: left;
margin-bottom:40px;
padding-top:150px;
}

#intro p{
padding-left:180px;
font-size: 120%;
}


#second{
width: 100%;
height: 800px;
padding:40px;
background: #fff url(images/bg2.png) no-repeat fixed;
background-position:center top !important;
background-size:cover;
}

#second .inner{
text-align:center;
}

/*#second .boxL{
display: inline-block;
vertical-align: bottom;
letter-spacing: normal;
width:50%;
text-align: right;
}

#second .boxR{
display: inline-block;
vertical-align: bottom;
letter-spacing: normal;
width:50%;
}*/


#third{
width: 100%;
height: 1200px;
padding:40px;
background: #fff url(images/bg3.png) no-repeat fixed;
background-position:center top!important;
background-size:cover;
}

/*#third p{
padding-left:180px;
}*/

#third .inner{
text-align:center;
}

#fourth{
width: 100%;
height: 900px;
padding:40px;
background: #fff url(images/bg6.png) no-repeat fixed;
background-position:center top !important;
background-size:cover;
}

#fourth .inner{
text-align:center;
}

#fourth table{
width:1200px;
margin:0 auto 60px;
border-collapse:collapse;
border-spacing:0;
font-size: 90%;
}

#fourth table th:first-child{
width:100px;
}

#fourth table th{
width:220px;
padding:5px;
font-weight: bold;
background:#666;
color:#fff;
border:1px solid #777;
text-align: left;
}

#fourth table td{
padding:5px;
border:1px solid #777;
text-align: left;
background:#fff;
}

#fourth table td:first-child{
background:#f6f6f6;
}

#five{
width: 100%;
height: 900px;
padding:40px;
background: #fff url(images/bg4.png) no-repeat fixed;
background-position:center top !important;
background-size:cover;
}

#five .inner{
text-align:center;
}

/*#fifth{
width: 100%;
height: 1700px;
padding:40px;
background: #fff url(images/bg5.png) no-repeat fixed;
background-position:center top !important;
background-size:cover;
letter-spacing: -.4em;
}

#fifth .boxL{
display: inline-block;
vertical-align: top;
letter-spacing: normal;
width:50%;
text-align: right;
}

#fifth .boxR{
display: inline-block;
vertical-align: top;
letter-spacing: normal;
width:50%;
}
*/

#sixth{
width: 100%;
height: 1800px;
padding:40px;
background: #fff url(images/bg5.png) no-repeat fixed;
background-position:center bottom!important;
background-size:cover;
}

#sixth h2{
margin-bottom:20px;
}

#sixth .contact{
width:1200px;
margin:0 auto 100px;
padding:20px;
background:rgba(255,255,255,.5);
text-align: center;
}

#sixth table{
width:1200px;
margin:0 auto 100px;
border-collapse:collapse;
border-spacing:0;
font-size: 90%;
/*background:rgba(255,255,255,.5)
*/}

#sixth table td:first-child{
width:200px;
}

#sixth table td{
padding:20px 0 0 20px;
text-align: left;
}

#sixth table tr:last-child td{
padding:20px 0 20px 20px;
}

#sixth .responsibility{
width:1200px;
margin:0 auto 100px;
padding:20px;
background:rgba(255,255,255,.5);
font-size: 90%;
}

#sixth .footer{
width:1200px;
margin:0 auto;
padding:20px 0;
font-size:10px;
}

.sp{
display: none;
}








/*SP用
────────────────────────────────────*/
@media screen and (max-width:768px){


.pc{
display: none;
}

.sp{
display: block;
}

p{
padding:0 3%;
}

h2{
width:100%;
margin-bottom: 20px;
padding:0 3%;
text-align: center;
}

.header {
width:100%;
margin:0;
padding:20px 3%;
overflow:hidden;
}

.linkRight {
float: none;
text-align: center;
margin-bottom: 5px;
}

.btn{
display:block;
width:100%;
margin:0 0 20px;
padding:10px 0;
}

.btn:first-child{
margin:0 0 20px;
}

.meeting:link{color: #fff;}
.meeting:visited{color: #fff;}
.meeting:hover{color: #fff;}
.meeting:active{color: #fff; opacity: .7;}

.online:link{color: #fff;}
.online:visited{color: #fff;}
.online:hover{color: #fff;}
.online:active{color: #fff; opacity: .7;}

.meeting{
background: #13BF78;
border: 2px solid #13BF78;
}

.online{
background: #029FEC;
border: 2px solid #029FEC;
}

.meeting:after,.online:after {
display: none;
}



.intro{
width: 100%;
margin-bottom:40px;
}

.main_image{
width:100%;
height: 0;
padding-top:70%;
position: relative;
overflow: hidden;
margin-bottom: 20px;
}

.main_image img{
width:100%;
position: absolute;
top:0;
left: 0;
margin-top:-30%;
}




.second{
width: 100%;
margin-bottom:40px;
padding:5px 0 0;
background:#fff/* url(images/bg2.png)*/ no-repeat;
background-size:contain;
}

.second h2{
margin-bottom: 150px;
}



.third{
width: 100%;
margin-bottom:40px;
padding:60px 0 20px ;
background:#fff /*url(images/bg3.png)*/ center top no-repeat;
background-size:contain;
}

.third h2{
margin-bottom:35%;
}


.fourth{
width: 100%;
margin-bottom:40px;
padding:5px 0 0;
background:#fff /*url(images/bg4.png)*/ center top no-repeat;
background-size:contain;
}

.fourth h2{
margin-bottom:60px;
}

.fourth table{
width:94%;
margin:0 3% 20px;
border-collapse:collapse;
border-spacing:0;
font-size: 90%;
}

.fourth table th{
width:40%;
padding:5px;
font-weight: bold;
background:#666;
color:#fff;
border:1px solid #777;
text-align: left;
}

.fourth table th:first-child{
width:20%;
}

.fourth table td{
padding:5px;
border:1px solid #777;
text-align: left;
background:#fff;
}

.fourth table td:first-child{
background:#f6f6f6;
}



.five{
width: 100%;
margin-bottom:40px;
padding:20px 0 0;
background:#fff /*url(images/bg5.png)*/ bottom no-repeat;
background-size:contain;
}

.five h2{
margin-bottom:160px;
}



.sixth{
width: 100%;
padding:20px 0;
background:#fff url(images/bg5.png) center bottom no-repeat;
background-size:contain;
}

.sixth table{
width:94%;
margin:0 3% 40px;
border-collapse:collapse;
border-spacing:0;
font-size: 90%;
}

.sixth .contact{
margin:0 0 20px;
}

.sixth table td:first-child{
width:30%;
}

.sixth table td{
padding:5px 3%;
text-align: left;
border: 1px solid #ddd;
}

.sixth .responsibility{
margin:0 0 20px;
font-size: 90%;
}

.sixth .footer{
width:100%;
padding:20px 3%;
text-align: center;
}