@charset "utf-8";

*{
margin:0;
padding:0;
}

.clearfix{zoom:1;}
.clearfix:after{
content:"";
display:block;
clear:both;
}

body{
background-color:#fff;
}

header,h1,h2,h3,h4,th,footer,p,dl,table,ul,li{
font-family:"メイリオ",meiryo,"MS Pゴシック","MS PGothic","ヒラギノ角ゴProW3","Hiragino Kaku Gothic Pro",Osaka,sans-serif;
color:#555;
}

/*----------header------------*/

.wrapper{
width:100%;
margin:0;
}

header{
width:1000px;
height:auto;
margin-left:auto;
margin-right:auto;
}

header .logo{
width:20%;
float:left;
}

header h1 img{
width:200%;
height:auto;
margin-left:10px;
margin-top:20px;
}

header .tel{
float:right;
width:40%;
margin-top:20px;
}

header .tel img{
width:100%;
height:auto;
}

header p{
width:42%;
float:left;
}

header ul li{
width:100%;
list-style-type:none;
height:auto;
text-align:center;
}

header ul li:hover{
background-color:#ff0;
}

header ul li img{
margin:0;
}

/*----------メイン画面------------*/

.main{
width:100%;
height:500px;
background-image:url(images/main_image2.png);
background-size:cover;
background-repeat:no-repeat;
background-position:center center;
box-shadow:0 2px 2px rgba(0,0,0,0.5) inset;
}

.main-title{
width:100%;
margin-left:auto;
margin-right:auto;
padding-top:20px;
background-color:#9fd8ee;
padding-bottom:20px;
background-image:url(images/title-back.png);
background-repeat:no-repeat;
background-position:right center;
}

.main-title a{
text-decoration:none;
}

.main-title h1{
text-align:center;
color:#555;
}

.main-title h1 .point1{

}

.main-title h1 .point2{
padding:2px 10px 0 10px;
font-size:1.5em;
border:5px double #fdf5f9;
border-radius:50%;
color:#f29c9f;
}

.main-title p{
width:900px;
margin-left:auto;
margin-right:auto;
text-align:center;
color:#f29c9f;
font-weight:bold;
}

.main-title p .point3{
background-color:#3ab483;
font-size:1.5em;
font-weight:400;
color:#fff;
margin-left:10px;
padding:2px 10px 0 10px;
border-radius:3px;
box-shadow:2px 2px 0px 1px #777;
}

.main-title .point3:hover{
position:relative;
top:1px;
left:1px;
box-shadow:none;
}

/*-----------こんな悩みありませんか？--------------*/
.nayami{
width:560px;
height:auto;
margin:50px auto 50px auto;
}

.nayami h2{
width:100%;
clear:both;
line-height:1.5;
margin-bottom:30px;
text-align:center;
border-bottom:5px solid #fff7a0;
}

.nayami h2 .point4{
font-size:1.5em;
color:#3ab483;
font-weight:bold;
}

.nayami h2 .point4-2{
font-size:0.7em;
font-weight:300;
padding:3px 10px 3px 10px;
background-color:#fadbe1;
line-height:1.5;
border-radius:2px;
}

.nayami .nayami-text{
width:70%;
float:left;
}

.nayami .nayami-text li{
font-size:1.2em;
line-height:1.5;
margin-bottom:20px;
list-style-type:none;
}

.nayami .nayami-text li span{
border-bottom:2px dotted #aaa;
}

.nayami .nayami-text li i{
color:#3ab483;
}

.nayami .nayami-img{
width:30%;
float:right;
}
.nayami .nayami-img img{
width:100%;
}


/*-----------APSなら心配ありません--------------*/

.riyu_box{
width:100%;
height:auto;
}

.riyu_box h2{
width:100%;
height:100px;
text-align:center;
color:#fff;
background-color:#94d0bf;
font-size:2.1em;
line-height:3;
background-image:url(images/title-back.png);
background-repeat:no-repeat;
background-position:left center;
}

.riyu_box 3:after {
position:relative;
content: '';
top: 90%;
left:-200px;
border: 15px solid transparent;
border-top: 15px solid #0b6dd8;
width: 0;
height: 0;
}

.riyu_box h2 .point5{
color:#fffabb;
}

/*-----------APSサッカークラブが選ばれる理由--------------*/
.riyu_honbun{
width:900px;
margin:50px auto 10px auto;
}

.riyu_honbun h3{
width:100%;
text-align:center;
color:#f6ad48;
line-height:1.5;
margin-bottom:30px;
}

.riyu_honbun h3 .point6{
font-size:1.5em;
padding-left:10px;
padding-right:10px;
color:#555;
background:linear-gradient(transparent 70%, #fff7a0 0%);
}

.riyu_honbun p{
font-size:1.2em;
line-height:1.5;
text-align:center;
margin-bottom:20px;
}

.riyu_honbun p span{
border-bottom:2px dotted #aaa;
}

.riyu_honbun p .point7{
color:#f6ad48;
font-weight:600;
}


/*-----------選ばれる理由の説明--------------*/

.riyu_setumei{
width:900px;
margin-right:auto;
margin-left:auto;
}

.riyu_setumei ul li{
width:280px;
height:460px;
box-sizing:border-box;
border:1px #fff solid;
box-shadow: 0px 0px 2px #333; 
margin-right:25px;
margin-top:40px;
float:left;
list-style-type:none;
padding-bottom:15px;
border-radius:10px;
}

.riyu_setumei li:nth-child(3){
margin-right:0;
}

.riyu_setumei li:nth-child(6){
margin-right:0;
}

.riyu_setumei h3{
width:100%;
height:40px;
font-size:1.3em;
text-align:center;
background-color:#94d0bf;
color:#fff;
line-height:1.8;
margin-top:15px;
margin-bottom:15px;
}

.riyu_setumei p{
width:90%;
margin-left:auto;
margin-right:auto;
line-height:1.5;
text-align:justify;
font-size:90%;
}

.riyu_setumei p img{
width:100%;
height:auto;
}

#riyu_6{
height:460px;
background-image:url(images/riyu_img6_2.webp);
background-repeat:no-repeat;
background-size:cover;
border:none;
}

/*-----------お問い合わせ--------------*/

.contact{
width:900px;
height:80px;
margin:50px auto 50px auto;
}

.contact p{
width:430px;
height:80px;
float:left;
text-align:center;
margin-right:30px;
line-height:4;
font-size:1.3em;
}

.contact p i{
margin-left:10px;
}

.contact p a{
text-decoration:none;
color:#fff;
}

.contact p .point8{
display:block;
height:80px;
background-color:#f6ad48;
border-radius:3px;
box-shadow:5px 5px 0 0 #f0891d;
}

.contact p .point8:hover{
position:relative;
top:5px;
left:5px;
box-shadow:none;
}

.contact p .point9{
display:block;
height:80px;
background-color:#239dda;
border-radius:3px;
box-shadow:5px 5px 0 0 #0068b7;
}

.contact p .point9:hover{
position:relative;
top:5px;
left:5px;
box-shadow:none;
}

.contact p:nth-child(2){
margin-right:0;
}


/*-----------よくある質問--------------*/

.qa_box{
width:100%;
height:auto;
}

.qa_box h2{
width:100%;
height:100px;
text-align:center;
background-color:#fadbe1;
font-size:2.1em;
line-height:3;
background-image:url(images/title-back.png);
background-repeat:no-repeat;
background-position:right center;
}

/*.qa_box h2 span{
background:linear-gradient(transparent 70%, #fff7a0 0%);
}*/

.qa_box h2 img{
position:relative;
top:15px;
left:20px;
}

.qa_setumei{
width:100%;
height:auto;
background-color:#fdf5f9;
}

.qa_setumei ul{
width:900px;
height:auto;
list-style:none;
margin-left:auto;
margin-right:auto;
padding-top:50px;
padding-bottom:25px;
}

.qa_setumei ul .qa_q li{
font-size:1.2em;
font-weight:bold;
color:#f29c9f;
line-height:1.5;
}

.qa_setumei ul .qa_q li span{
font-size:1.5em;
color:#fff;
padding-left:11px;
padding-right:12px;
background-color:#f29c9f;
border-radius:50%;
}

.qa_setumei ul .qa_a li{
margin-left:30px;
line-height:1.5;
text-align:justify;
margin-bottom:25px;
}

.qa_setumei ul .qa_a li span{
font-size:1.5em;
font-weight:600;
color:#f29c9f;
}


/*-----------保護者からの声--------------*/


.koe_box{
width:100%;
height:auto;
}

.koe_box h2{
width:100%;
height:100px;
text-align:center;
color:#fff;
background-color:#94d0bf;
font-size:2.1em;
line-height:2.9;
background-image:url(images/title-back.png);
background-repeat:no-repeat;
background-position:left center;
}

.koe_box h2 img{
position:relative;
top:10px;
margin-right:10px;
}

.koe_setumei{
box-sizing:border-box;
width:900px;
height:auto;
padding:20px;
margin-top:40px;
margin-right:auto;
margin-left:auto;
}

.koe_setumei .koe_img{
width:25%;
float:left;
}

.koe_setumei .koe_img img{
width:100%;
height:auto;
border-radius:50%;
box-shadow:3px 3px 0 0 #e3f4ff;
}

.koe_setumei .koe_text{
box-sizing:border-box;
width:70%;
float:right;
background-color:#f3fff9;
padding:20px;
border-radius:5px;
}

.koe_setumei h3{
margin-bottom:10px;
}

.koe_setumei p{
line-height:1.5;
text-align:justify;
}

/*------------体験会の流れ------------*/


.nagare_box{
width:100%;
height:auto;
}

.nagare_box h2{
width:100%;
height:100px;
text-align:center;
color:#555;
background-color:#fadbe1;
font-size:2.1em;
line-height:3;
background-image:url(images/title-back.png);
background-repeat:no-repeat;
background-position:right center;
}

.nagare_box h2 img{
position:relative;
top:15px;
left:0px;
margin-right:10px;
}


.nagare_box .nagare_honbun{
width:600px;
margin-left:auto;
margin-right:auto;
}

.nagare_box .nagare_honbun .nagare_step{
box-sizing:border-box;
width:45%;
height:220px;
margin-right:10%;
margin-top:60px;
background-color:#fdf5f9;
box-shadow: 0px 0px 0px 5px #fdf5f9;
float:left;
padding: 0.2em 0.5em;
border: dashed 1px #f29c9f;
border-radius:10px;
}

.nagare_box .nagare_honbun .nagare_step p{
width:95%;
margin-left:auto;
margin-right:auto;
text-align:center;
line-height:1.5;
}

.nagare_box .nagare_honbun .nagare_step p span{
box-sizing:border-box;
display:inline-block;
width:60px;
height:60px;
background-color:#f29c9f;
font-weight:600;
color:#fff;
padding-top:8px;
padding-left:3px;
padding-right:3px;
margin-bottom:15px;
border-radius:50%;
position:relative;
top:-30px;
}

.nagare_box .nagare_honbun .nagare_step:nth-child(2){
margin-right:0;
}

.nagare_box .nagare_honbun .nagare_step:nth-child(4){
margin-right:0;
}

/*--------電話でのお問い合わせ-------*/

.tel2{
width:100%;
height:auto;
}

.tel2 h2{
width:100%;
height:70px;
text-align:center;
color:#fff;
background-color:#9fd8ee;
font-size:1.7em;
line-height:2.7;
font-weight:650;
background-image:url(images/title-back.png);
background-repeat:no-repeat;
background-position:right center;
}

.tel2 .tel_no{
width:340px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:40px;
margin-bottom:40px;
text-align:center;
}

.tel2 .tel_no ul li{
width:100%;
list-style-type:none;
font-size:2.7em;
}

.tel2 .tel_no ul li a{
text-decoration:none;
color:#f6ad48;
}

.tel2 .tel_no ul li:hover{
opacity:0.8;
}

/*-----------------------footer----------------------*/
footer{
width:100%;
height:70px;
background-color:#333;

}

.footer2{
width:1040px;
height:70px;
margin-right:auto;
margin-left:auto;
}

.footer2 small{
display:block;
color:#fff;
text-align:center;
padding-top:25px;
}

/*----------------------------------------------スマホ用---------------------------------------------*/
@media screen and (max-width:480px){

header{
width:100%;
height:auto;
margin-left:0;
margin-right:0;
}

header .logo{
width:120px;
}

header h1 img{
width:100%;
margin-left:10px;
margin-top:15px;
}

header .tel{
width:200px;
margin-top:10px;
margin-right:10px;
}

header .tel img{
width:100%;
height:auto;
}

header ul li{
height:auto;
}


/*-------------メイン画面-----------------*/


.main{
width:100%;
height:300px;
}

.main-title{
box-sizing:border-box;
width:100%;
height:160px;
margin-left:0;
margin-right:0;
padding-top:10px;
padding-bottom:20px;
background-size:cover;
}

.main-title h1{
width:250px;
margin-left:auto;
margin-right:auto;
font-size:1.2em;
line-height:1.5;
}

.main-title h1 .point2{
padding:2px 10px 0px 10px;
font-size:1.5em;
}

.main-title p{
width:225px;
margin-left:auto;
margin-right:auto;
margin-top:5px;
text-align:center;
font-size:0.9em;
font-weight:500;
line-height:1.5;
}

.main-title p .point3{
line-height:1.5;
padding-top:3px;
padding-bottom:3px;
margin-left:0;
}

.main-title .point3:hover{
position:relative;
top:1px;
left:1px;
box-shadow:none;
}

/*-----------こんな悩みありませんか？--------------*/
.nayami{
width:310px;
height:300px;
margin:30px auto 0 auto;
}

.nayami h2{
width:100%;
font-size:0.925em;
font-weight:500;
margin-left:auto;
margin-right:auto;
line-height:1.5;
margin-bottom:30px;
text-align:center;
border-bottom:5px solid #fff7a0;
}

.nayami h2 .point4-2{
font-size:0.9em;
}

.nayami .nayami-text{
width:100%;
float:none;
}

.nayami .nayami-text li{
font-size:0.925em;
line-height:1.5;
margin-bottom:20px;
}

.nayami .nayami-text li span{
border-bottom:2px dotted #aaa;
}

.nayami .nayami-img{
width:24%;
height:auto;
float:none;
position:relative;
top:-180px;
left:230px;
}

.nayami .nayami-img img{
width:100%;
}


/*-----------APSなら心配ありません--------------*/

.riyu_box{
width:100%;
height:auto;
}

.riyu_box h2{
width:100%;
height:70px;
text-align:center;
font-size:1.4em;
line-height:3.2;
background-size:100%;
background-position:left center;
}

.riyu_box h2:after {
display:none;
}


/*-----------APSサッカークラブが選ばれる理由--------------*/
.riyu_honbun{
width:100%;
margin:30px auto 0 auto;
}

.riyu_honbun h3{
width:100%;
font-size:1em;
margin-left:0;
margin-right:0;
margin-bottom:20px;
}

.riyu_honbun p{
width:95%;
margin-left:auto;
margin-right:auto;
font-size:0.925em;
line-height:1.5;
margin-bottom:20px;
}


/*-----------選ばれる理由の説明--------------*/

.riyu_setumei{
width:90%;
height:auto;
}

.riyu_setumei ul li{
width:100%;
height:auto;
margin-right:0;
margin-top:30px;
float:none;
}

.riyu_setumei h3{

}

.riyu_setumei p{
font-size:0.925em;
}

.riyu_setumei p img{

}

#riyu_6{

}

/*-----------お問い合わせ--------------*/

.contact{
width:90%;
height:auto;
margin:50px auto 50px auto;
}

.contact p{
width:100%;
height:50px;
float:none;
margin-right:0;
line-height:3.3;
font-size:1em;
margin-bottom:10px;

}

.contact p i{
margin-left:10px;
}

.contact p a{

}

.contact p .point8{
height:50px;
}

.contact p .point9{
height:50px;
}


/*-----------よくある質問--------------*/

.qa_box{
width:100%;
height:auto;
}

.qa_box h2{
width:100%;
height:80px;
font-size:1.6em;
line-height:3.2;
background-size:100%;
}

/*.qa_box h2 span{
background:linear-gradient(transparent 70%, #ffff00 0%);
}*/

.qa_box h2 img{
width:60px;
height:auto;
position:relative;
top:10px;
left:10px;
}

.qa_setumei{
width:100%;
height:auto;
}

.qa_setumei ul{
width:90%;
height:auto;
margin-left:auto;
margin-right:auto;
padding-top:30px;
padding-bottom:1px;
}

.qa_setumei ul .qa_q li{
font-size:1.1em;
margin-bottom:15px;
line-height:1.8;
text-align:justify;
}

.qa_setumei ul .qa_q li span{
font-size:1em;
padding-top:3px;
padding-bottom:3px;

}

.qa_setumei ul .qa_a li{
font-size:0.925em;
margin-left:0;
line-height:1.5;
text-align:justify;
margin-bottom:25px;
}

.qa_setumei ul .qa_a li span{
font-size:1em;
font-weight:600;
color:#f29c9f;
}


/*-----------保護者からの声--------------*/


.koe_box{
width:100%;
height:auto;
}

.koe_box h2{
width:100%;
height:80px;
font-size:1.6em;
line-height:3.2;
background-size:100%;
}

.koe_box h2 img{
width:45px;
}

.koe_setumei{
width:90%;
height:auto;
margin-top:30px;
padding:20px 0 0 0;
background-color:e3f4ff;
border-radius:5px;
}

.koe_setumei .koe_img{
width:50%;
float:none;
margin:0 auto 0 auto;
}

.koe_setumei .koe_img img{
width:100%;
box-shadow:3px 3px 0 0 #fff7a0;
}

.koe_setumei .koe_text{
width:100%;
float:none;
padding:0;
margin-top:5px;
background-color:#fff;
}

.koe_setumei h3{
font-size:1.1em;
line-height:1.5;
background: linear-gradient(transparent 80%, #fff7a0 0%);
}

.koe_setumei p{
box-sizing:border-box;
width:100%;
height:auto;
padding:20px;
font-size:0.925em;
line-height:1.5;
text-align:justify;
background-color:#f3fff9;
border-radius:3px;
}


/*------------体験会の流れ------------*/


.nagare_box{
}

.nagare_box h2{
width:100%;
height:80px;
font-size:1.6em;
line-height:3.2;
background-size:100%;
}

.nagare_box h2 img{
}

.nagare_box .nagare_honbun{
width:250px;
}

.nagare_box .nagare_honbun .nagare_step{
box-sizing:border-box;
width:100%;
height:150px;
margin-right:0;
margin-top:60px;
float:none;
}

.nagare_box .nagare_honbun .nagare_step p{
font-size:0.925em;
height:100px;
position:relative;
top:-35px;
}

.nagare_box .nagare_honbun .nagare_step p span{
top:0;
margin-bottom:15px;
}

.nagare_box .nagare_honbun .nagare_step:nth-child(2){
}

.nagare_box .nagare_honbun .nagare_step:nth-child(4){
}

/*------------電話でのお問い合わせ------------*/

.tel2{
width:100%;
height:auto;
margin-left:0;
margin-right:0;
margin-bottom:0px;
}

.tel2 h2{
width:100%;
height:50px;
font-size:1.2em;
line-height:2.9;
background-size:100%;
}

.tel2 .tel_no{
width:100%;
float:none;
margin-top:30px;
margin-bottom:30px;
text-align:center;
}

.tel2 .tel_no ul{
width:70%;
margin-left:auto;
margin-right:auto;
}

.tel2 .tel_no ul li{
width:100%;
font-size:2.2em;
}



/*--------------FOOTER---------------*/

footer{
width:100%;
height:auto;
background-color:#333;
}

.footer2{
width:90%;
height:auto;
margin-right:auto;
margin-left:auto;
}

.footer2 small{
display:block;
color:#fff;
text-align:center;
padding-top:25px;
padding-bottom:25px;

}



}