/* 全デバイス共通 */

html,body {
	width: 100%;
	height:100%;
}
body {
    font-family: "Microsoft Yahei","PingHei" ,'Noto Sans Japanese',"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    background-image: url('../../img/index/tennis_top_m.jpg');
    /*background: url('../img/back7.jpg') no-repeat 30% 30%;*/
    background-size: cover;
	background-attachment: fixed;
    background-color: #ffffff;
}

h1	{
	/*font-family: "Microsoft Yahei","PingHei" ,'Raleway', sans-serif;*/
    /* font-family: yomogi, sans-serif!important; */
    font-family:Noto Sans JP, Hiragino Kaku Gothic Pro, ヒラギノ角ゴ Pro W3, Meiryo, メイリオ, Osaka, MS PGothic, ＭＳ Ｐゴシック, sans-serif!important;
    font-style: normal;
    font-weight: bold;
    /* width:100%; */
	text-align:center;
	font-size: 50px;
	color: #FFFFFF;
	line-height: 47px;
}

h2 {
    font-family: source-han-sans-japanese, sans-serif!important;
    font-style: normal;
    font-weight: 200;    
}


/* top */


#top	{
	width: 100%;
	height: 600px;
    position:relative;
    background-color: rgba(255, 255, 255, 0.20);
    line-height: 0px;
}

#top h1	{
    font-size: 55px;
    font-weight: 300;
    text-shadow: 5px 5px 5px #000000;
    color: #FFFFFF;
    background-color: rgba(0, 0, 0, 0.30);
    padding: 25px;
    line-height: 54px;
    text-align: center;
    width:100%;
    position:absolute;
    top: 200px;
}

#top h2	{
    font-size: 26px;
    text-shadow: 5px 5px 5px #000000;
    color: #FFFFFF;
    background-color: rgba(0, 0, 0, 0.30);
    padding: 0px 25px 50px 25px;
    line-height: 60px;
    text-align: center;
    width:100%;
    position:absolute;
    top: 304px;
}

#top h3	{
    font-size: 20px;
    font-weight: 500;
    text-shadow: 1px 1px 1px #434343;
    color: #FFFFFF;
    padding: 25px;
    line-height: 54px;
    text-align: center;
    width:100%;
    position:absolute;
    top: 240px;
}
.category h2 {
    margin: 0;
    padding: 20px 0 10px;
    /* color: #000000; */
    font-size: 16px;
    font-weight: bold;
}




/* 表示幅 */
.service{
    background-color:#ffffffb0;
    padding: 0 20% ;
}
.service a {
    text-decoration: underline;
    font-weight: bold;
}

/* lp */
.lp .service{
	background: #132940;	/*背景色*/
	color: #eee;	/*文字色。css冒頭で指定しているtext-colorを読み込みます*/
}
.lp h3 {
    font-size: 20px;
    font-weight: 700;
	color: #d15d08;	/*文字色。css冒頭で指定しているprimary-text-colorを読み込みます*/
	display: inline-block;
	border-bottom: 3px solid #d15d08;	/*下線の幅、線種、varは色のことで、css冒頭で指定しているtext-colorを読み込みます*/
}
.lp p{
    font-size: 16px!important;
    padding: 10px 0!important;
}

   
#QA .service{
    background-color:#ffffff;   
    padding-bottom: 50px;
}
/* スライドショー */
.slider img{
    padding: 0 180px ;
}
.bx-viewport{
    background-color: rgba(58, 58, 58, 0.82);
}
.bx-wrapper {
    margin-bottom: 25px!important;
}






/* リスト */

.new-member-list {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    padding: 0;
    margin-bottom: 20px;
}
.item {
    margin: 10px;
    margin-left: 0;
    display: inline-block;
    width: 120px;
    height: 120px;
    font-size: 14px;
    /* border-radius: 50%; */
    /* background: rgba(255, 0, 0, 0.4); */
}
.item a {
    color: #595858;
    font-size: 12px;
    text-decoration: none;
}
.item img {
    margin-bottom: 10px;
    width:120px;
    height:90px;
    filter: drop-shadow(1px 1px 1px rgba(66, 76, 83, 0.5));
    object-fit:cover;
    border-radius: 30px;
}

.sports img {
    margin-bottom: 10px;
    width:70px;
    height:70px;
    filter: drop-shadow(1px 1px 1px rgba(66, 76, 83, 0.5));
    object-fit:cover;
    border-radius: 0px;
}



/* カテゴリー  */

.category	{
    position: relative;
    overflow: auto;
    /*box-shadow: 0px 4px 9px 0px rgba(0,0,0,0.50);*/
    padding-top: 110px;
}

.category > h1 {
    font-weight: bold;
    font-size: 30px;
    padding: 1em;
    background-color: rgba(58, 58, 58, 0.82);
    box-shadow: 0px 5px 3px -3px rgba(0,0,0,0.4);
    color: #ffffff;
}


.category article	{
    padding: 20px;
	position: relative;
	width:100%;
	height:auto;
	overflow: auto;
    background: transparent;
}

.category article .content:before	{
/*	background-color: rgba(255,255,255,0.8);*/
    background: #ffffff;

    content: "";
	z-index: -1;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	position: absolute;
	top:0;
	right:0;
}


.category p.category_exp{
    text-align: left;
    padding:50px 130px;
    font-size: 22px;
    color: rgba(67, 67, 67, 0.95);
}


.post_category {
    line-height: 1.3em;
    border-right: solid 1px #F5F5F5;
}





/* ポリシー*/
#container {
    position: relative;
    margin: 100px 50px;
    padding-top: 50px;
    background-color: white;

}

#contents {
    width: 80%;
    margin-right: auto;
    margin-left: auto;
}
#container textarea {
    width: 100%;

}

.form-actions {
    margin: 10px;
}

.center {
    text-align: center;
}










/* contact */
#contact{
    position: relative;
    top:0;
    left:0;
    width:100%;
    z-index:-2;
}

#contact p	{
    background: #9c9c9c;
    padding:50px 20%;
    width:100%;
    color: #ffffff;
    line-height: 33px;
    height:200px;

}


#contact  a {
    font-weight: normal;
    font-size: 14px;
    color: #434343;
    text-decoration: underline;
}

#contact  a:hover {
    color: white;
}

/* sports ボタン */
.but_sports{
    margin: 0 auto;
    padding-left: 10px;
}
.but_sports a {
    /* background: #eee;
    border-radius: 3px;
    position: relative;
    display: inline-block;
    margin: 0 auto;
    width: 33%;
    padding: 20px 20px;
    color: #313131;
    transition: 0.3s ease-in-out;
    font-weight: 500;
    font-size: 17px;
    text-decoration: none;
    text-align: center; */
    display: inline-block;
    margin: 0 auto;
    width: 32%;
    color: #313131;

    text-align: center;
    text-decoration: none;
    height: 80px;
    padding: 32px 30px 20px 45px;
    background-color: #eee;
    /* border: 5px solid #FFC107; */
    border-radius: 7px;
    box-sizing: border-box;
    position: relative;
    transition-duration: 0.3s;

}
.but_sports a:before {
    /* position: relative;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 10px;
    color: #999; */
    content: '';
    width: 40%;
    height: 40%;
    position: absolute;
    top: 65%;
    left: 20%;
    margin-top: -30px;
    background-size: contain;
    background-repeat: no-repeat;

}
.but_sports a.c_tennis:before {
    background-image: url("../../img/index/pic_tennis.png");
}
.but_sports a.c_golf:before {
    background-image: url("../../img/index/pic_golf.png");
}
.but_sports a.c_else:before {
    background-image: url("../../img/index/pic_baseball.png");
}
.but_sports a:hover {
    background:rgba(58, 58, 58, 0.82);
    color: #FFF;
    /* color: #ffffff;
    background-color: #FFC107; */
}
.but_sports span {
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
}




/* Q&A */
div.cp_qa{
    padding-top: 50px;

}
.cp_qa *, .cp_qa *:after, .cp_qa *:before {
    font-family: 'FontAwesome', sans-serif;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.cp_qa dt,.cp_qa dd {
    position: relative;
    padding: 0.5em;
    box-shadow: 0px 1px 1px rgba(0,0,0,0.2);
    border-radius: 0.3em;
}
.cp_qa dt {
    margin: 0 3em 1em 3em;
    background: #ffe0b2;
}
.cp_qa dd {
    margin: 0 3em 3em 3em;
    background: #b2ebf2;
}
/* 吹き出し▶︎ */
.cp_qa dt::before,.cp_qa dd::before{
    position: absolute;
    z-index: 99;
    top: 0.5em;
    display: inline-block;
    width: 0;
    height: 0;
    content: '';
    border-style: solid;
}
/* 質問吹き出し▶︎ */
.cp_qa dt::before {
    left: -0.5em;
    border-width: 5px 8.7px 5px 0;
    border-color: transparent #ffe0b2 transparent transparent;
}
/* 答え吹き出し▶︎ */
.cp_qa dd::before {
    right: -0.5em;
    border-width: 5px 0 5px 8.7px;
    border-color: transparent transparent transparent #b2ebf2;
}
/* ?!アイコン */
.cp_qa dt::after,.cp_qa dd::after {
    font-size: 1.2em;
    position: absolute;
    top: 0;
    color: #ffffff;
    border-radius: 50%;
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    line-height: 1.2em;
}
/* ?アイコン */
.cp_qa dt::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    left: -2.5em;
    margin: 0 0.5em 0 0;
    padding: 0.2em 0.4em;
    content: '\f128';
    background: #f57c00;
}
/* !アイコン */
.cp_qa dd::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    right: -2.5em;
    margin: 0 0 0 0.5em;
    padding: 0.2em 0.55em;
    content: '\f12a';
    background: #0097a7;
}


.point_box {
    position: relative;
    padding: 1em 1.5em;
    margin: 2em 0;
    border: solid 3px #347af4;/*線*/
    border-radius: 8px;/*角の丸み*/
    color: #000000;/*文字色*/
}
.point_box .point_title{
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 10px;
    line-height: 1;
    font-size: 1.3em;/*タイトル文字サイズ*/
    background: #ffffff;/*タイトル文字背景色*/
    color: #347af4;/*タイトル文字色*/
    font-weight: bold;
}
.point_box p {
    margin: 0;
    padding: 0;
    font-size: 18px;
}



/* footer */
footer{
    background-color: #000000;
    color: #ffffff;
    padding-bottom: 50px;
}

footer p	{
    margin:0 auto;
    padding:40px;
    /*font-family: "Microsoft Yahei","PingHei" ,'Raleway';*/
    font-weight: normal;
    font-size: 20px;
    line-height: 47px;
    text-align: center;
}





/* 解像度低めのPC
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/

@media screen and (max-width:1024px) and (min-width:768px)	{


    body {
        /*        background-size: cover;
        background-image: url('../../img/index/tennis_top_m.jpg');*/

        background: url('../../img/index/tennis_top_m.jpg') 0% 10%;
        /*background-size: contain;*/
         background-color:#000000 !important;
        background-size: cover;
        background-attachment: fixed;
    }

    #top{
        height: 600px;
    }

    #top h1	{
        font-size: 38px;
        font-weight: 400;
        color: #FFFFFF;
        line-height: 35px;
        position:absolute;
        top:270px;
    }

    #top h2	{
        font-size: 16px;
        font-weight: 300;
        color: #FFFFFF;
        line-height: 20px;
        position:absolute;
        top:355px;
        padding: 30px 50px;
    }

    #top h3	{
        /*font-family: "Microsoft Yahei","PingHei" ,Raleway;*/
        font-size: 16px;
        font-weight: 500;
        color: #FFFFFF;
        line-height: 20px;
        position:absolute;
        top:260px;
        padding: 30px 50px;
    }
    .category	{
        padding-top: 110px;
    }


    .category article	{
        padding: 0px;
        position: relative;
        width:100%;
        height:600px;
        overflow: auto;
    }

    .service{
        padding: 0 15% ;
    }

    /* スライドショー */
    .slider img{
        padding: 0 80px ;
    }

    #contact p	{
        padding:50px 10%;
    }


    footer p	{
		font-size: 18px;
        padding: 0 10% ;
	}


}

/* タブレット
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/


@media screen and (max-width:767px) and (min-width:481px)	{

    body {
        /*        background-size: cover;
                background: url('../../img/index/back.jpg') no-repeat 50% 50%;*/

        background: url('../../img/index/tennis_top_m.jpg') no-repeat 0% 20% ;
        background-size: contain;
         background-color:#000000 !important;;
        /*background-size: cover;*/
        background-attachment: fixed;
    }

    #top{
        height: 500px;
    }

    #top h1	{
        /*font-family: "Microsoft Yahei","PingHei" ,Raleway;*/
        font-size: 30px;
        font-weight: 400;
        color: #FFFFFF;
        line-height: 30px;
        position:absolute;
        top:160px;
    }

    #top h2	{
        /*font-family: "Microsoft Yahei","PingHei" ,Raleway;*/
        font-size: 16px;
        font-weight: 300;
        color: #FFFFFF;
        line-height: 20px;
        position:absolute;
        top:240px;
        padding: 30px 50px;
    }

    #top h3	{
        /*font-family: "Microsoft Yahei","PingHei" ,Raleway;*/
        font-size: 16px;
        font-weight: 500;
        color: #FFFFFF;
        line-height: 20px;
        position:absolute;
        top:190px;
        padding: 30px 50px;
    }
    .category	{
        padding-top: 100px;
    }

    .category article	{
        padding: 0px;
        position: relative;
        width:100%;
        height:700px;
        overflow: auto;
    }

    /* 表示幅 */
    .service{
        padding: 0 50px ;
    }

    .but_sports a {
        padding: 27px 0px 22px 30px;
        font-weight: 500;
    }
    .but_sports span {        
        font-size: 14px;
        font-weight: 500;
    }


    /* スライドショー */
    .slider img{
        padding: 0 100px ;
    }



    /*　ポリシー　*/
    #container {
        margin: 0px 0px;
        padding-top: 0px;
        background-color: #000000;
    }

    #contents {
        width: 100%;
        margin-right: 0px;
        margin-left: 0px;
        padding-top: 100px;
    }


    /*　フッター　*/
    footer p	{
        font-size: 18px;
    }

}




/* スマートフォン
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/


@media screen and (max-width:480px)	{

    body {
        /*        background-size: cover;
                background: url('../../img/index/back.jpg') no-repeat 50% 50%;*/

        background: url('../../img/index/tennis_top_s.jpg') 0% 100px no-repeat;
        background-size: contain;
        background-color:transparent;
    }

    #top{
        height: 300px;
    }

    #top h1	{
		/*font-family: "Microsoft Yahei","PingHei" ,Raleway;*/
		font-size: 22px;
		font-weight: 300;
		color: #FFFFFF;
		line-height: 35px;
		position:absolute;
		top:85px;
        padding: 30px 0px 0px 0px;
	}

    #top h2	{
        /*font-family: "Microsoft Yahei","PingHei" ,Raleway;*/
        font-size: 12px;
        font-weight: 200;
        color: #FFFFFF;
        line-height: 20px;
        position:absolute;
        top:150px;
        padding: 0px 0px 20px 0px;
    }

    #top h3	{
        /*font-family: "Microsoft Yahei","PingHei" ,Raleway;*/
        font-size: 12px;
        font-weight: 500;
        color: #FFFFFF;
        line-height: 15px;
        position:absolute;
        top:130px;
        padding: 15px;
    }
    /* リスト */

    .new-member-list {
        margin-bottom: 10px;
    }
    .item {
        margin: 10px;
        display: inline-block;
        width: 60px;
        height: auto;
        font-size: 14px;
    }
    .item a {
        font-size: 12px;
    }
    .item img {
        margin: 0px;
        width:70px;
        height:50px;
        filter: drop-shadow(1px 1px 1px rgba(66, 76, 83, 0.5));
        object-fit:cover;
        border-radius: 10px;
    }

    .sports img {
        margin-bottom: 10px;
        width:50px;
        height:50px;
        filter: drop-shadow(1px 1px 1px rgba(66, 76, 83, 0.5));
        object-fit:cover;
        border-radius: 0px;
    }
    .people div {
        margin-top: 10px;
        font-size: 10px;
        text-align: center;
    }

    /* スライドショー */
    .slider img{
        padding: 0px ;
    }

    .category {
        padding-top: 0;
        padding-bottom: 30px;
    }
    .category > h1	{
        font-size: 22px;
        font-weight: 400;
        padding: 20px 20px;
        margin-top: 0px;
    }

    .category article	{
        padding: 0px;
        position: relative;
        width:100%;
        height:auto;
        overflow: auto;
    }



    .service{
        padding: 0 5px ;
    }


    .but_sports{
        padding-left: 3px;
    }
    
    .but_sports a {
        margin: 0 auto;
        width: 32%;
        padding: 22px 0px 22px 20px;
        font-weight: 500;
        font-size: 13px;
        height:65px;
    }
    .but_sports a:before {
        top: 75%;
        left: 10%;    
    }
    .but_sports span {        
        font-size: 13px;
        font-weight: 500;
        line-height: 1;
    }
    
    /* lp */
    .lp h3 {
        font-size: 18px;
        margin: 10px 10px!important;
    }
    .lp p{
        font-size: 14px!important;
        padding: 10px 15px!important;
    }


    /* Q&A */
    div.cp_qa{
        padding-top: 20px;

    }



    /* ポリシー*/
    #container {
        margin: 0px 0px;
        padding-top: 0px;
        background-color: #000000;
    }

    #contents {
        width: 100%;
        margin-right: 0px;
        margin-left: 0px;
        padding-top: 30px;
    }


    /*　コンタクト　*/
    #contact p	{
        height: 100px;
        font-size: 10px;
        line-height: 20px;
        padding: 20px 20px;

    }



    /*　フッター　*/
    footer{
        padding-bottom: 80px;
    }
    footer p	{
		font-size: 10px;
        padding: 20px;
	}


}