@charset "utf-8";
/* Copyright 2020 FSFIELD All Rights Reserved. */

@media print, screen and (min-width:768px){ /* 表示領域が768px以上の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	トップページ

	------------------------------------------------------------ */

	/* メインビジュアル
	---------------------------------------------- */
	.main{
		background: url("../img/home/pc/bg_main01.jpg") repeat-x 0 0;
		margin: 20px 0 30px;
	}
	
	.main_inner p{
		transform: translateX(50%);
		margin-left: -1200px;
	}
	
    /* オンライン説明会
	---------------------------------------------- */
    .wrap_online{
        overflow: hidden;
        width: 800px;
        margin: 0 auto;
        padding: 30px 0 50px;
    }
    
    .wrap_online img{vertical-align: middle;}
    
    .header_online01{
        font-size: 2.4rem;; 
        font-weight:bold; 
        color:#ffffff; 
        background:#20b2aa; 
        text-align:center;
        padding: 20px 0;
    }
    
    .txt_online01,
    .online_youtube01,
    .online_faq{margin-bottom: 30px;}
        
    .btn_online01 a{
        padding: 6px 10px;
        background: #13B2B2;
        color: #FFF;
        border-radius: 4px;
    }
    
    .btn_online01 a:hover{
        color: #13B2B2;
        background: #FFF;
        border: 1px solid #13B2B2;
    }
    
    /* TGSW 教員リスト用 */
    .list_online01{
        display: flex;
        flex-wrap: wrap;
        margin: 20px 0;
    }
    
    .list_online01 li{margin-right: 30px;}
    
    .list_online02{
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 50px;
        padding-left: 10px;
    }
    
    .list_online02 li{
        width: 131px;
        height: 32px;
        text-indent: -1.7rem;
        padding-left: 7px;
    }
    
    .list_online01 li.red::before,
    .list_online02 li.red::before{
        content:'';
        width:10px;
        height:10px;
        display:inline-block;
        background:#F00;
        border-radius:50%;
        margin-right:5px;
    }
    
    .list_online01 li.yellow::before,
    .list_online02 li.yellow::before{
        content:'';
        width:10px;
        height:10px;
        display:inline-block;
        background:#FFC000;
        border-radius:50%;
        margin-right:5px;
    }
    
    .list_online01 li.blue::before,
    .list_online02 li.blue::before{
        content:'';
        width:10px;
        height:10px;
        display:inline-block;
        background:#5B9BD5;
        border-radius:50%;
        margin-right:5px;
    }
    
    .list_online03{
        padding:10px;
        border: thin solid gray;
        display: flex;
        justify-content: center;
    }
    
    .list_online03 li{margin-right: 20px;}
    
    .list_online03 li:last-child{margin: 0;}
    
	/* コンテンツ
	---------------------------------------------- */
    .bn_aside p:last-child{margin-bottom: 0;}
    
	.wrap_home{
		width: 900px;
		margin: 0 auto 100px;
		display: flex;
		justify-content: space-between;
	}
	
	.content_home{width: 480px;}
	
	.item a{
		border: 1px solid #CCCCCC;
		border-bottom: none;
		color: #333;
		display: flex;
	}
	
	.item:last-of-type a{border-bottom:1px solid #CCCCCC;}
	
	.item a:hover{opacity: 0.7;}
	
	.item_inner{
		width: 70%;
		padding: 30px 20px;
	}
	
	.txt_item{
		font-weight: bold;
		font-size: 1.7rem;
		margin-bottom: 10px;
		background: url("../img/ico_arrow09.jpg") no-repeat 0 0.28em;
		background-size: 20px;
		padding: 0 0 0 28px;
	}
	
	.item .image{
		width: 30%;
		background-repeat: no-repeat;
		background-position: 0 center;
		background-size: cover;
	}
	
	.item:nth-of-type(1) .image{background-image: url("../img/home/nav_home01.png");}
	.item:nth-of-type(2) .image{background-image: url("../img/home/nav_home02.png");}
	.item:nth-of-type(3) .image{background-image: url("../img/home/nav_home03.png");}
	
	.aside_home{width: 190px;}
	
	/*--最新情報--*/
    .news_home{margin-top: 29px;}
	
	.txt_news_home{
		background: linear-gradient(to bottom, #FFF, #E6E6E6);
		border-top: 1px solid #CCCCCC;
		border-bottom: 1px solid #CCCCCC;
		padding: 5px 0 5px 15px;
		font-weight: bold;
		font-size: 1.4rem;
		position: relative;
	}
	
	.txt_news_home::before{
		content: "";
		display: block;
		background: #33A6A6;
		width: 5px;
		height: 15px;
		position: absolute;
		top: 50%;
		left: 0;
		margin-top: -7.5px;
	}
	
	.news_home_inner{
		height: 300px;
		overflow-y: scroll;
	}
	
	.article_home{
		font-size: 1.3rem;
		padding: 10px 0;
		border-bottom: 1px dotted #CCC;
	}
	
	.article_home time{
		color: #999999;
		display: block;
	}
	
	.article_home a{
		display: block;
		color: #333;
	}
	
	.article_home a p{text-decoration: underline;}
	
	.article_home a p:hover{text-decoration: none;}
	

}/*--@media--*/


@media only screen and (max-width:767px){ /* 表示領域が767px以下の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	スマートフォン（iPhone,Android)

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	トップページ

	------------------------------------------------------------ */
    .top_container{
        display: flex;
        flex-direction: column-reverse
    }
    
	/* メインビジュアル
	---------------------------------------------- */
	.main{margin: 15px 0 30px;}
	
	.main_inner p img{width: 100%;}
    
    /* オンライン説明会
	---------------------------------------------- */
    .wrap_online{padding:  10px 10px 30px;}
    
    .wrap_online img{vertical-align: middle;}
    
    .header_online01{
        font-size:large; 
        font-weight:bold; 
        color:#ffffff; 
        background:#20b2aa; 
        text-align:center;
        padding: 20px 10px;
    }
    
    .txt_online01,
    .online_youtube01,
    .online_faq{margin-bottom: 30px;}
    
    .btn_online01 a{
        padding: 4px 8px;
        background: #13B2B2;
        color: #FFF;
        border-radius: 4px;
    }
    
    /* TGSW 教員リスト用 */
    .list_online01{
        display: flex;
        flex-wrap: wrap;
        margin: 20px 0;
    }
    
    .list_online01 li{margin-right: 20px;}
    
    .list_online02{
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 30px;
    }
    
    .list_online02 li{
        width: 50%;
        margin-bottom: 16px;
    }
    
    .list_online02 li:nth-last-child(2){margin-bottom: 0;}
    
    .list_online02 li:last-child{margin-bottom: 0;}
    
    .list_online01 li.red::before,
    .list_online02 li.red::before{
        content:'';
        width:10px;
        height:10px;
        display:inline-block;
        background:#F00;
        border-radius:50%;
        margin-right:5px;
    }
    
    .list_online01 li.yellow::before,
    .list_online02 li.yellow::before{
        content:'';
        width:10px;
        height:10px;
        display:inline-block;
        background:#FFC000;
        border-radius:50%;
        margin-right:5px;
    }
    
    .list_online01 li.blue::before,
    .list_online02 li.blue::before{
        content:'';
        width:10px;
        height:10px;
        display:inline-block;
        background:#5B9BD5;
        border-radius:50%;
        margin-right:5px;
    }
    
    .list_online03{
        padding:10px;
        border: thin solid gray;
        display: flex;
        justify-content: center;
    }
    
    .list_online03 li{margin-right: 15px;}
    
    .list_online03 li:last-child{margin: 0}
	
	/* コンテンツ
	---------------------------------------------- */
	.wrap_home{
		display: flex;
		flex-direction: column;
	}
	
	.content_home{
		order: 1;
		padding: 0 10px;
		margin-bottom: 20px;
	}
	
	.item a{
		border: 1px solid #CCCCCC;
		border-bottom: none;
		display: flex;
		color: #333;
	}
	
	.item:last-of-type a{border-bottom:1px solid #CCCCCC;}
	
	.item_inner{
		width: 60%;
		padding: 20px 10px;
	}
	
	.txt_item{
		font-weight: bold;
		font-size: 1.6rem;
		margin-bottom: 5px;
		background: url("../img/ico_arrow09.jpg") no-repeat 0 0.2em;
		background-size: 20px;
		padding: 0 0 0 28px;
	}
	
	.item .image{
		width: 40%;
		background-repeat: no-repeat;
		background-position: 0 center;
		background-size: cover;
	}
	
	.item:nth-of-type(1) .image{background-image: url("../img/home/nav_home01.png");}
	.item:nth-of-type(2) .image{background-image: url("../img/home/nav_home02.png");}
	.item:nth-of-type(3) .image{background-image: url("../img/home/nav_home03.png");}
	
	.aside_home{
		order: 2;
		padding: 0 10px;
		margin-bottom: 20px;
	}
	
	.aside_home .bn_aside{
		padding: 0;
		background: none;
        margin-bottom: 15px;
	}
	
	.aside_home .bn_aside p{margin-bottom: 0;}
	
	.wrap_home .aside01{
        order: 3;
        display: flex;
        flex-direction: column-reverse;
    }
	
	/*--最新情報--*/
	.news_home{
        margin-top: 20px;
    }
	
	.txt_news_home{
		background: linear-gradient(to bottom, #FFF, #E6E6E6);
		border-top: 1px solid #CCCCCC;
		border-bottom: 1px solid #CCCCCC;
		padding: 5px 0 5px 15px;
		font-weight: bold;
		font-size: 1.5rem;
		position: relative;
	}
	
	.txt_news_home::before{
		content: "";
		display: block;
		background: #33A6A6;
		width: 5px;
		height: 15px;
		position: absolute;
		top: 50%;
		left: 0;
		margin-top: -7.5px;
	}
	
	.news_home_inner{
		height: 200px;
		overflow-y: scroll;
        border: 1px solid #CCCCCC;
        border-top: none;
        padding: 0 10px;
	}
	
	.article_home{
		font-size: 1.3rem;
		padding: 10px 0;
		border-bottom: 1px dotted #CCC;
	}
	
	.article_home time{
		color: #999999;
		display: block;
		margin-bottom: 3px;
	}
	
	.article_home a{
		display: block;
		color: #333;
	}
	
	.article_home a p{text-decoration: underline;}
    
    /*--Facebook--*/
	.facebook-wrapper {
		margin-bottom: 0;
        padding: 0;
	}
	

}/*--@media--*/