@charset "UTF-8";

/*======================================================
サイト共通の設定
======================================================*/

/*-----------------------------
フォントの設定
-----------------------------*/


html {
	font-size: 62.5%;/* 16px x 0.625 = 10px(=1rem) */
}

body {
	font-size: 1.6rem;/* 14px */
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro-W3", "メイリオ", Meiryo, sans-serif;
}

/* スマホの時は13pxで */
@media(max-width:480px){
    body{
        font-size:1.4rem;
    }
}

/*　文字詰めの設定 */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	::i-block-chrome, body {
		-webkit-font-feature-settings: "pkna";
		font-feature-settings: "pkna";
	}
}

/*------------------------------------------------
WordPress画像の配置
------------------------------------------------*/

@media(min-width:481px){

    /* 画像配置 左 */
    img.alignleft {
        text-align: left;
        margin:0 20px 10px 0;
    }

    /* 画像配置 中央 */
    img.aligncenter {
        display: block;
        margin: 10px auto;
    }

    /* 画像配置 右 */
    img.alignright {
         display: block;
         margin: 0 0 10px 20px;
    }
    
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}


/*-----------------------------
共通の設定
-----------------------------*/

body {
	line-height: 1.75;
	color: #333;
}

li, p{
    color:#333;
}

ol li{
    list-style-position: inside;
}

figcaption {
	font-size: 1.1rem;
    line-height: 1.3;
}

.att{
    font-size:1.2rem;
}

/*clearfix*/

.cf:after {
  content: ""; 
  display: block; 
  clear: both;
 }

dl dt, dl dd{
    padding:0;
    margin:0;
}

img{
    max-width: 100%;
    height: auto;
    width /***/:auto;
}

.resize img{
    max-width: 100vw;
}

.tel-link a:link,.tel-link a:hover,.tel-link a:active{
    color:#333;
}

section,article{
    margin-bottom:60px;
}

.sentence{
    text-indent: 1em;
}

table.ta th, table.ta td{
    border:1px solid #999;
    padding:8px;
}

table.ta th{
    text-align: left;
    font-weight: normal;
}

address{
    font-style: normal;
}

/*----  テーブルのレスポンシブ設定 --*/

@media screen and (max-width: 480px) {
    .table{
        width: 100%;
    }
    .table th,
    .table td{
        display: block;
    }
}


/*-----　　禁則処理　　-----*/

p{ line-break: normal; }
p{ line-break: strict; }




/*-----------------------------
表示に関するcss
-----------------------------*/


@media screen and (max-width:768px){
    
    /*スマホのときだけ表示しない設定*/
    .s-none{
        display: none !important;
    }

    /* スマホのときだけ左寄せ */
    .s-left{
        text-align:left;    
    }
    
}

@media (min-width:769px){
    /* パソコン以上で表示しない */
    .pc-none{
        display: none !important;
    }
}


/*-----------------------------
リンク
-----------------------------*/

a:hover img{
    opacity: 0.6;
    filter: alpha(opacity=50);
    -webkit-transition:0.4s;
    transition: 0.4s;
}

a:link ,a:visited {
	color: #333;
    text-decoration: none;
    -webkit-text-decoration:underline dotted;
    text-decoration:underline dotted;
}

a:hover{
	color: #999;
}


/*　この辺りにマージンだけとかフロートだけとか　*/

.w600{
    max-width:600px;
    margin:20px auto;
}


.w800{
    max-width:800px;
    margin:auto;
}

.w1000{
    max-width:1000px;
    margin:auto;
}


@media(min-width:769px){
    .w60{
        width:60%;
        margin: 0 auto;
    }

    .w80{
        width:80%;
        margin: 0 auto;
    }
	.pc-font30{
    font-size:30px;
    font-size:3.0rem !important;

	}
}

.mb10 {
	margin-bottom: 10px !important;
}

.mb20 {
	margin-bottom: 20px !important;
}

.mb30 {
	margin-bottom: 30px !important;
}

.mt30{
    margin-top: 30px !important;
}

.mb40 {
	margin-bottom: 40px !important;
}

.mb50{
    margin-bottom:50px !important;
}

.mb60{
    margin-bottom:60px !important;
}

.mb70{
    margin-bottom:70px !important;
}

.mb80{
    margin-bottom:80px !important;
}

.mr10{
    margin-right:10px !important;
}

.mr20{
    margin-right:20px !important;
}

.mr30{
    margin-right:30px !important;
}

.ml10{
    margin-left:10px !important;
}

.ml20{
    margin-left:20px !important;
}

.ml30{
    margin-left:30px !important;
}


.indent-1{
    text-indent: 1em;
}

.indent-2{
    text-indent: 2em;
}

.indent-3{
    text-indent: 3em;
}
.pd20{padding:20px;}
.pd15{padding:15px;}
.pdr20{padding-right:20px;}

.lh12{
    line-height: 1.2;
}

.lh15{
    line-height:1.5;
}

.left {
	text-align: left;
}

.right {
	text-align: right;
}

.center {
	text-align: center;
}
@media(min-width:769px){
.pcenter {
	text-align: center;
}
}
.ti1{padding-left: 1em;}
/*　flexbox設定　*/


.flex-c{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.flex-bw{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.flex-ar{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.flex-st{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:start;
    -ms-flex-pack:start;
    justify-content:flex-start;
}

.flex-en{
     display:-webkit-box;
     display:-ms-flexbox;
     display:flex;
    -webkit-box-pack:end;
    -ms-flex-pack:end;
    justify-content:flex-end;   
}

.fo-1{
    -webkit-box-ordinal-group:2;
    -ms-flex-order:1;
    order:1;
}

.fo-2{
    -webkit-box-ordinal-group:3;
    -ms-flex-order:2;
    order:2;
}

.fo-3{
    -webkit-box-ordinal-group:4;
    -ms-flex-order:3;
    order:3;
}

.fo-4{
    -webkit-box-ordinal-group:5;
    -ms-flex-order:4;
    order:4;
}

.fo-5{
    -webkit-box-ordinal-group:6;
    -ms-flex-order:5;
    order:5;
}

.fo-6{
    -webkit-box-ordinal-group:7;
    -ms-flex-order:6;
    order:6;
}

/* PCの時だけフレックスボックス　*/

@media(min-width:768px){

    .p-flex-c{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .p-flex-bw{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .p-flex-ar{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -ms-flex-pack: distribute;
        justify-content: space-around;
    }

    .p-flex-st{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:start;
        -ms-flex-pack:start;
        justify-content:flex-start;
    }

    .p-flex-en{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:end;
        -ms-flex-pack:end;
        justify-content:flex-end;   
    }
.instatop{width:80%;margin:0 auto;}


}


/*　font　*/

.font10 {
    font-size:10px;
	font-size: 1.0rem !important;
}

.font11{
    font-size:11px;
    font-size:1.1rem !important;
}

.font12{
    font-size:12px;
    font-size:1.2rem !important;
}

.font13{
    font-size:13px;
    font-size:1.3rem !important;
}

.font14{
    font-size:14px;
    font-size:1.4rem !important;
}

.font15{
    font-size:15px;
    font-size:1.5rem !important;
}

.font16{
    font-size:16px;
    font-size:1.6rem !important;
}

.font17{
    font-size:17px;
    font-size:1.7rem !important;
}

.font18{
    font-size:18px;
    font-size:1.8rem !important;
}

.font19{
    font-size:19px;
    font-size:1.9rem !important;
}

.font20{
    font-size:20px;
    font-size:2.0rem !important;
}

.font21{
    font-size:21px;
    font-size:2.1rem !important;
}

.font22{
    font-size:22px;
    font-size:2.2rem !important;
}

.font23{
    font-size:23px;
    font-size:2.3rem !important;
}

.font24{
    font-size:24px;
    font-size:2.4rem !important;
}

.font25{
    font-size:25px;
    font-size:2.5rem !important;
}

.font26{
    font-size:26px;
    font-size:2.6rem !important;
}

.font27{
    font-size:27px;
    font-size:2.7rem !important;
}

.font28{
    font-size:28px;
    font-size:2.8rem !important;
}

.font29{
    font-size:29px;
    font-size:2.9rem !important;
}

.font30{
    font-size:30px;
    font-size:3.0rem !important;
}



/*　よく使う色　*/

.yellow{
    color:#f59700 !important;
}

.pink{
    color:#ef2e73 !important;
}

.redb{
    color:#ea0404;
    font-weight: bold;
}

.red{
    color:#ea0404;
}

.blue{
    color:#3485f2;
}

/* 学科ごとの色　*/

.en-color1{color:#094;}
.en-color2{color:#76bb86;}
.en-color3{color:#d5e87a;}
.ci-color1{color:#8cbd65;}
.ci-color2{color:#4b9e36;}
.ci-color3{color:#e4f1d9;}
.me-color1{color:#4db6ac;}
.me-color2{color:#0b8175;}
.me-color3{color:#80cbc4;}
.sp-color1{color:#498ecc;}
.sp-color2{color:#0060b7;}
.sp-color3{color:#7db7ec;}
.el-color1{color:#e3c400;}
.el-color2{color:#b7aa00;}
.el-color3{color:#edcd00;}
.ap-color1{color:#b59aac;}
.ap-color2{color:#a44d87;}
.ma-color1{color:#97a0a5;}
.ma-color2{color:#3e5c6d;}



/* ファイルダウンロード設定 */
.link-file::after{
    font-family: "Font Awesome 5 Free";
    content: "\f56d";
    font-weight: bold;
    font-weight: 900;
    color:#094;
    margin-left:10px;
}


/* 外部リンク設定 */
.link-site::after{
    font-family: "Font Awesome 5 Free";
    content: "\f35d";
    font-weight: bold;
    font-weight: 900;
    color:#094;
    margin-left:10px;

}