@charset "UTF-8";
/************************************************
 common css

font-family: "ヒラギノ明朝 Pro W3","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",YuMin_36pKn-Medium,serif;
font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif;


    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing: border-box;

border-radius: 10px 10px 0 0;

-----------------------------------------


google font
明朝　font-family: 'Noto Serif JP', serif;
ゴシック　font-family: 'Noto Sans JP', sans-serif;
欧文　font-family: 'Quattrocento', serif;

theme color #ff6347

instagram icon <i class="fab fa-instagram"></i>
.fa-instagram{color:coral;} カラー設定

@media(min-width:000px){}
@media(max-width:000px){}


.imgDef{
    width:100%;
    height: auto;
}
.textCenter{
    text-align: center;
}

.fl{float:left;}
.fr{float:right;}



body{
	font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif;
}

h1{
        width:100%;
        text-align: center;
    } 


    



    .cate a{
    width:48%;
    display: block;
    margin: 0 auto ;
    padding: 0px 0 0px;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing: border-box;
    overflow:auto;
    text-align: center;
    border-radius: 10px 10px 10px 10px;
    text-decoration:none;
    }
    
.btn a{background-color: #6495ed;}
.btn a:hover{background-color: #87cefa;}
    
    .date{
        text-align: center;
        font-size: 110%;
        font-weight: bolder;
    }
    .lead{
        text-align: center;
    }

.mT{margin-Top:50px;
}
.sg{
	font-size:90%;
}
.red{color:#f00}
p.foot{
text-align: left;
}
    


************************************************/



/*base
------------------------------------------------------------------*/
/*imgリンクに対してロールオーバー効果 数値%換算*/
a:hover img{opacity:0.6;filter:alpha(opacity=80);-ms-filter: "alpha( opacity=80 )";}

html { scroll-behavior: smooth;}

body{
    font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif;
    font-size: 1em;
    color: #333;
}

#Wrap {
	width:768px;
	margin:0 auto;
	color:#555;
	line-height:140%;
	font-size:90%;
}

    @media screen and (max-width:768px) {/*572*/
#Wrap {
	width:95%;
	margin:0 auto;
}   
    }


/*-------title----------*/
h1{
    font-size:1.5em;
    text-align: center;
    padding: 30px 0 30px 0;
    font-weight: bolder;
}

.red{color:#ff0000;}

.blue{color:#4169e1;}

.titleimg{ 
    width: 80%;
    margin: 0 auto;
}


    @media screen and (max-width:768px) {/*572*/
.titleimg {
	width:80%;}     
    }
/*-------title- end ---------*/


.lead{
    padding: 50px 0 50px 0;
    text-align: center;
    font-size: 1em;
    line-height: 180%;
}

@media screen and (max-width:768px) {/*572*/
.lead{
    padding: 30px 0 30px 0;
    text-align: center;
    font-size: 0.9em;
    line-height: 140%;
}     
    }


/*------date--------*/

.box1{
    width: 80%;
    margin-top: 20px;
    margin: 0 auto;
    text-align: center;
}

@media screen and (max-width:768px) {/*572*/
.box1{
    width: 90%;
}      
    }

h3{
    padding: 3px 0 3px;
    background-color: #eee;
    font-weight: bolder;
    font-size: 1em;
}

.sg1{
    font-weight: bolder;
    font-size: 1.2em;
    line-height: 120%;
    padding-top:10px;
}

/*------trigger-------*/


h4{
    font-weight: bolder;
    font-size: 1.2em;
    color:#ff4500;  
}

.ssg{
    font-size: 0.9em;
}


.plan-container{
    display: grid;
    gap: 30px;
    margin: 0 auto;
}

@media(min-width:768px){
.plan-container{
    width:360px;
        /*    grid-template-columns: repeat(2, 1fr); */
    }
}

@media(max-width:768px){
.plan-container{
    width: 70%;
    }
}


.plan{
    padding: 20px 20px 10px;
    border-radius:20px;
    border: solid 2px #ff4500;
}

.btn a{
    display: block;
    margin: 10px auto;
    width:200px;
    padding: 5px;
    box-sizing:border-box;
    border-radius: 50px;
    background-color: #ff7f50;
    color:#fff;
    font-size: 0.9em;
    font-weight: bolder;
}

.btn a:hover{
    background-color: #ff4500;
}


/********************** base ******************************/

/* セパレートライン */
.spline{
    margin-top: 60px;
    padding-top: 30px;
    border-top: solid 1px #ccc;
}

/*img
---------------------*/

.imgDef{
    display:block;
    width:100%;
    height: auto;
}





/*hide pc sp　改行
-------------------------------------------------*/

@media(min-width:768px){
.sp{display: none}
}/*end*/
@media(max-width:768px){
.pc{display: none}
}/*end*/

/*sample <span class="pc"><br></span>　*/



/********************** コンテンツ ******************************/


/*
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing: border-box;
/*

/*footer
----------------------------------------------*/
.footer{
    height:80px;
    font-size: 1em;
    padding-top:10px;
    border-top:1px solid #ccc;
    margin-top: 50px;
    text-align: center;
}
		


/*************************coomon spacing *************************************/

/*marginSet
----------------------------------------------*/
.mT5{margin-top:5px;}
.mT10{margin-top:10px;}
.mT15{margin-top:15px;}
.mT20{margin-top:20px;}
.mT25{margin-top:25px;}
.mT30{margin-top:30px;}
.mT35{margin-top:35px;}
.mT40{margin-top:40px;}
.mT45{margin-top:45px;}
.mT50{margin-top:50px;}
.mT55{margin-top:55px;}
.mT60{margin-top:60px;}
.mT65{margin-top:65px;}
.mT70{margin-top:70px;}
.mT100{margin-top:100px;}

.mB5{margin-bottom:5px;}
.mB10{margin-bottom:10px;}
.mB15{margin-bottom:15px;}
.mB20{margin-bottom:20px;}
.mB25{margin-bottom:25px;}
.mB30{margin-bottom:30px;}
.mB35{margin-bottom:35px;}
.mB40{margin-bottom:40px;}
.mB45{margin-bottom:45px;}
.mB50{margin-bottom:50px;}














