@charset "utf-8";
/* CSS Document */
#main{
position:relative;
width:100%;
overflow:hidden;
}
#main img{
width:100%;
height:auto;
padding-top:30px;
}
#main img:nth-of-type(2){display:none;}
#contents{
max-width:100%;
margin:0 auto;
padding:5em 0 0;
}
@media screen and (max-width: 768px) {
#main-visual span img{
width:1500px;
margin-top:10px;
margin-left: -750px; 
}
}
@media screen and (max-width: 640px) {
#main img:nth-of-type(1){display:none;}
#main img:nth-of-type(2){display:inline;}
#main-visual span img{
width:1000px;
margin-top:10px;
margin-left: -480px; 
}
}
#top_message{
position:absolute;
width:100%;
display:block;
top:100px;
left:8%;
margin:0; 
padding:0;
}
#top_copy{
color:#fff;
font-size:200%;
display:inline-block;
vertical-align:middle;
font-weight:500;
line-height:1.2;
padding-left:2em;
padding-bottom:0.5em;
}
#top_copy span{color:#f44779;}
#top_copy span:nth-of-type(2){
border:1px solid #f44779;
width:5em;
height:5em;
display:block;
border-radius:50%;
position:absolute;
bottom:-1em;
left:0;
}
#main p{
position:relative;
margin:0;
padding:0;
top:0;
left:0;
}
#top_message p{
color:#fff;
padding:0 0 0 4.7em;
font-size:90%;
font-family: 'Open Sans';
font-weight:600;
}
@media screen and (min-width:1200px) {
#top_message{
top:180px;
left:12%;
}
#top_copy{
font-size:250%;
padding-left:2em;
padding-bottom:0.5em;
}
#top_message p{padding:0 0 0 6em;}
}
@media screen and (max-width:768px) {
#top_message{
top:80px;
left:8%;
}
#top_copy{
font-size:150%;
padding-left:2em;
padding-bottom:0.2em;
}
#top_message p{
padding:0 0 0 4.5em;
font-size:70%;
}
}
#about1{
text-align:center;
margin-bottom:4em;
}
#about1 dl{margin-top:3em;}
#about1 dt{
font-size:170%;
padding-bottom:0.8em;
padding-top:1em;
line-height:1.3;
font-weight:500;
}
/*#about1 dt span{
font-size:45%;
letter-spacing:0.2em;
}*/
#about1 dd{
font-size:90%;
line-height:2.5;
padding-bottom:2em;
}
#about dd span{
font-size:90%;
}
#about dd span span{
font-size:130%;
}
@media screen and (max-width:768px) {
#contents{
padding-top:1em;
width:100%;
}
#about1 dl{
width:90%;
margin:1em auto 0;
}
#about1 dd{
text-align:justify;
font-size:80%;
}
#about1 dd br{display:none;}
}
.slider3{margin:20px 0 0;}
.slider3 img{
width:300px;
height:auto;
margin-right:20px;
border-radius:8px;
}
@media screen and (max-width:640px) {
.slider3{margin:20px 0 30px;}
.slider3 img{width:150px;margin-right:10px;}
}
h3{
text-align:center;
font-size:120%;
padding-bottom:2em;
}
#logo2 dt{font-size:120%;}
#logo2 img{
width:120px;
height:auto;
padding:1em 0;
}
#about2,#about3{margin-bottom:5em;}

#about2 p img,#about3 p img{
width:100%;
height:auto;
}
#about2 p span{
display:block;
position:absolute;
background:#fff;
top:20%;
right:15%;
width:220px;
height:100px;
font-size:120%;
font-weight:bold;
padding-top:70px;
}
#about3 p span{
display:block;
position:absolute;
background:#fff;
top:20%;
right:15%;
width:220px;
height:90px;
font-size:120%;
font-weight:bold;
padding-top:50px;
padding-bottom:100px;
}
#about2 p span span{
position:relative;
top:0;
right:0;
padding:1em;
font-size:60%;
padding:10px 0 0;
color:#c4ae00;
}
#about3 p span span{
position:relative;
top:0;
right:0;
padding:2em;
font-size:60%;
padding:20px 0 0;
color:#c4ae00;
}
#about2 table{
border-collapse: collapse;
border-top:1px solid #bbb;
width:90%;
max-width:960px;
margin:0 auto;
font-size:90%;
}
#about2 th,#about2 td{
border-bottom:1px solid #bbb;
text-align:left;
}
#about2 th{
padding:2em 4em 2em 12em;
width:25em;
}
#about2 td{
padding:2em 5em 2em 4em;
}
#about2 p,#about3 p{
text-align:center;
position:relative;
padding-bottom:3em;
}
@media screen and (max-width:1000px) {
#about2 table{
margin:0 auto;
font-size:90%;
}
#about2 th{
padding:1.5em 1em 1.5em 3em;
width:8em;
}
#about2 td{padding:1.5em 3em 1.5em 1em;}
}
@media screen and (max-width:768px) {
#logo2 img{
width:80px;
height:auto;
padding:1em 0;
}
#about2 p span{
top:25%;
right:10%;
width:180px;
height:75px;
font-size:100%;
font-weight:bold;
padding-top:50px;
}
#about2 p span span{
padding:1em;
font-size:60%;
padding:5px 0 0 0;
color:#c4ae00;
}
#about3 p span{
top:25%;
right:10%;
width:180px;
height:75px;
font-size:100%;
font-weight:bold;
padding-top:50px;
padding-bottom:50px;
}
#about3 p span span{
font-size:60%;
padding:15px 0 0 0;
color:#c4ae00;
}
}
@media screen and (max-width:500px) {
h3{padding-bottom:1em;}
#about2,#about3{margin-bottom:3em;}
#about2 p,#about3 p{padding-bottom:2em;}
#about2 p span,#about3 p span{
display:block;
position:relative;
color:#fff;
background:#c4ae00;
top:0;
right:0;
width:auto;
height:auto;
font-size:100%;
padding:1em;
}
#about2 p span span,#about3 p span span{
display:inline;
padding:0;
font-size:60%;
padding:10px 0 0 0;
color:#fff;
padding-left:1em;
}
#about3 p span br{
display:none;
}
#about2 table{border-top:1px solid #555;}
#about2 th{
padding:1em 0.5em;
width:6em;
}
#about2 td{padding:1em 0.5em;}
}
#about3 ul{
width:90%;
max-width:960px;
margin:0 auto 2em;
font-size:90%;
}
#about3 li{
display:inline-block;
width:22%;
margin-right:4%;
}
#about3 li a{
color:#fff;
display:block;
background:#bbb;
text-align:center;
padding:1em 0;
border:none;
}
#about3 li a:hover{
color:#555;
background:#ddd;
}
#about3 li:nth-of-type(4){margin-right:0;}
#about3 li span{
font-size:80%;
display:inline-block;
border:1px solid #ddd;
margin-top:0.5em;
padding:0.2em 0.7em 0.1em;
}
#about3 li a:hover span{border:1px solid #555;}
#about3 ul:nth-of-type(2) li{
width:48%;
margin-right:4%;
text-align:center;
}
#about3 ul:nth-of-type(2) li:nth-of-type(2){margin-right:0;}
#about3 ul:nth-of-type(2) li span{
font-size:100%;
color:#555;
display:block;
background:#ddd;
text-align:center;
margin:1em 0 0.5em;
padding:1em 0;
border:none;
}
#about3  ul:nth-of-type(2) li span span{
font-size:80%;
display:inline-block;
border:1px solid #555;
margin:0 0 0 1em;
padding:0.2em 0.7em 0.1em;
}
#about3 ul:nth-of-type(2) li a{
color:#555;
display:block;
background:none;
text-align:center;
padding: 0;
border:none;
}
#about3 ul:nth-of-type(2) li a:hover{color:#5480ff;}
@media screen and (max-width:768px) {#about3 ul{font-size:70%;}}
@media screen and (max-width:500px) {
#about3 ul{width:80%;}
#about3 li{
display:block;
width:100%;
margin-right:0;
font-size:110%;
}
#about3 li br{display:none;}
#about3 li a{
padding:1.5em 0;
margin-bottom:1em;
}
#about3 li span{
font-size:80%;
margin:0 0 0 1em;
}
#about3 ul:nth-of-type(2) li{
width:100%;
margin:0 0 2em;
}
#about3 ul:nth-of-type(2) li span{
font-size:100%;
color:#555;
display:block;
background:#ddd;
text-align:center;
margin:1em 0;
padding:1em 0;
border:none;
}
#about3 ul:nth-of-type(2) li a{
color:#555;
display:block;
background:none;
text-align:center;
padding: 0;
border:none;
}
}
#about2 h3{
margin:1em 0 0;
font-size:170%;
font-weight:500;
padding-bottom:1em;
}

#about2 section p,
#about3 section p,
#about2 section li{
font-size:90%;
width:80%;
max-width:1020px;
margin:0 auto;
text-align:justify;
line-height:2;
padding-bottom:0;
}
#about2 section ul{
margin:1.5em 0;
}

@media screen and (max-width:768px) {
#about2 h3{
margin:0.5em 0 0;
padding-bottom:0.5em;
font-size:120%;
font-weight:700;
}
#about2 section p,
#about3 section p,
#about2 section li{
width:90%;
}
}

#about4{
width:80%;
max-width:1020px;
margin:0 auto;
}
#about4 h4{
text-align:center;
border-bottom:1px solid #bbb;
padding-bottom:0.5em;
font-size:115%;
}
#about4 section{
display: flex;
justify-content:space-around;
margin-top:2em;
}
#about4 ul{
margin-top:1em;
line-height:2em;
}
#about4 dl:nth-of-type(1) li:nth-of-type(1){
font-size:110%;
margin-left:-0.5em;
}

#about4 dl{
width:45%;
}
#about4 dt{
background:#ddd;
padding:0.5em 1em;
}
#about4 dd{
font-size:90%;
margin-top:1em;
}

@media screen and (max-width:768px) {
#about4{
width:90%;
}
}
@media screen and (max-width:580px) {
#about4 section{
display:block;
}
#about4 dl{
width:100%;
margin-bottom:1em;
}
#about4 dt{
background:#ddd;
padding:0.5em 1em;
}
#about4 dd{
font-size:90%;
margin-top:1em;
}

}
iframe,video{
margin-top:1em;
width:100%;
height:280px;
}
@media screen and (max-width:640px) {
iframe,video{
height:264px;
}
}