@charset "utf-8";
/* CSS Document */

/* ==============================================================
   # トップページ 共通
============================================================== */

/* hタグ ----------------*/

#index h2,
#index_demo h2{
	font-size:22px;
	margin:0 0 25px 0;
	padding:0;
	font-weight: 900;
	text-align: center;
	letter-spacing: 1px;
	line-height: 1.4;
}

#index h2 span,
#index_demo h2 span{
	font-size:1.3rem;
	display: block;
	margin-top: 1rem;
	font-weight: 900;
}


@media (min-width: 576px) {
	#index h2,
	#index_demo h2{
		font-size:3rem;
	}
	#index h2 span,
	#index_demo h2 span{
		font-size:1.5rem;
		margin-top: 1rem;
	}

}

@media (min-width: 992px) {
	#index h2,
	#index_demo h2{
		font-size:32px;
		margin:0 0 60px 0;
	}
	#index h2 span,
	#index_demo h2 span{
		font-size:1.8rem;
		margin-top: 1rem;
	}
}


@media (min-width: 600px) {
	#index h3,
	#index_demo h3{
		font-size:26px;
		margin-bottom:30px;
		padding-bottom:15px;
	}
}

/* ==============================================================
   # トップページ：KV
============================================================== */
#index_kv{
	background:url("../imgs/index/kv_bg_2026.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size:cover;
	padding:0;
	transition: 0.3s linear;
	text-align: center;
	position: relative;
}

#index_kv .inner{
	width:100%;
	max-width:1140px;
	margin:auto;
	padding: 0 30px;
}

@media (min-width: 1200px) {
	#index_kv .inner{
		padding: 0;
	}
}

@media (min-width: 992px) {
img.jjc_tokucyou_btn{ display:none; width:0; height:0; visibility:hidden; overflow:hidden;}
img.jjc_tokucyou_btn_pc{position:absolute; bottom:30px; right:70px; width:50%; max-width:190px; height:auto; visibility:visible; overflow:visible;}
}
@media (max-width: 992px) {
	#index_kv{
		background: none;
	}

		#index_kv .inner{
			padding: 0;
		}
	
	img.jjc_tokucyou_btn{position:absolute; bottom:0; right:0; width:30%; max-width:150px;}
	img.jjc_tokucyou_btn_pc{ display:none; width:0; height:0; visibility:hidden; overflow:hidden;}
}

#index_kv img{ width:100%; }

/*#kv{
	opacity: 0;
}*/

.animated{
	opacity: 0;
}

/* ==============================================================
   # トップページ：上部バナーエリア
============================================================== */

#top_banner_area{
	padding-top: 20px;
	padding-bottom: 40px !important;
}

@media (min-width: 576px) {
	#top_banner_area{
		padding-top: 30px;
		padding-bottom: 60px !important;
	}
}

@media (min-width: 768px) {
	#top_banner_area{
		padding-top: 3vw;
		padding-bottom: 6vw !important;
	}
}


@media (max-width: 768px) {
	.banner_area img{
		margin-bottom: 10px;
	}
}

/* ボタン --------------- */

.btn{
	text-align:center;
	margin:0;
	padding:0;
}

.btn.flex a{
	margin:0 auto 10px;
}

@media (min-width: 993px) {
	.btn.flex{
		display: flex;
		justify-content: center;
	}
	.btn.flex a{
		margin:0 15px;
	}
}

@media (min-width: 1200px) {

}

.btn a{
	background-color: #333;
	border-radius: 3px;
	color: #fff !important;
	font-weight: 500;
	max-width: 260px;
	width: 100%;
	padding: 1.6rem 1rem;
	margin:0 auto;
	display: block;
	font-size:13px;
	transition: 0.15s linear;
	letter-spacing: 1px;
}

@media (min-width: 768px) {
	.btn a{
		max-width: 340px;
		font-size:15px;
	}
}

.btn a:hover{
	background-color: #555;
	text-decoration: none;
}

.btn a{
	position: relative;
	vertical-align: middle;
}

.btn a::before{
    position: absolute;
    top: 0;
    bottom: 0;
    right: 15px;
    margin: auto;
    content: "";
    vertical-align: middle;
}

.btn a::before{
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.btn.left a,
.btn02.left a{
	margin-left: 0;
}

/* ==============================================================
   #　トップページ：ポイント3つ
   ============================================================== */

#point{
	background-color:#e9f8fb;
	position: relative;
}

#point::before{
	content: "";
	background:#fff;
	width: 100%;
	height: 26%;
	position: absolute;
	top:0;
	left:0;
}

@media (max-width: 767px) {
	#point::before{
		height:0;
	}
}

#point .point_box{
	background-color: #fff;
}

#point h3{
	text-align:center;
	font-size:18px;
	font-weight: 900;
	margin-bottom: 15px;
}

#point h3 img{
	margin:-40px 0 -10px 0;
}

#point h4{
	font-size:14px;
	font-weight: 900;
	margin:0 0 10px 0;
	padding:0;
	line-height: 1.5;
}

#point p,
#point li{
	font-size:14px;
	margin:0;
	padding:0;
}

#point .inner{
	padding:0 2rem 2rem 2rem;
}


@media (min-width: 768px) {
	#point .inner{
		padding:0 2.5vw 75px 2.5vw;
		margin-top: -30px;
		margin-bottom: 30px;
	}
	#point h3{
		font-size:20px;
		margin-bottom: 25px;
	}
	#point h3 img{
		margin:0;
	}

	#point h4{
		font-size:15px;
	}
	#point p,
	#point li{
		font-size:14px;
	}
}

@media (min-width: 993px) {
	#point h3{
		font-size:22px;
	}
	#point h4{
		font-size:16px;
	}
}

#point ul{
	margin-left: 24px;
}

#point li{
	list-style: disc;
}

#point .btn{
	padding:0 2rem 3rem 2rem;
}

@media (min-width: 768px) {
	#point .btn{
		padding:0 2.5vw 30px 2.5vw;
		margin: 0;
		position: absolute;
		bottom:0;
	}
}

#point .inner h3 + img{
	margin-bottom: 25px;
}

#point .point_box.hr .inner{
	border-left:1px dotted #ddd;
	border-right:1px dotted #ddd;
}


/* ==============================================================
   # トップページ：学科紹介
============================================================== */
#top_course h2{
	font-size:28px;
}

#top_course [class*="c0"] {
	margin-bottom: 20px;
}

#top_course [class*="c0"] .c_name{
	font-size:16px;
	font-weight: 900;
	margin-top: 15px;
}
#top_course [class*="c0"] .c_name span{
	background-color: #333;
	color: #fff;
	font-size:12px;
	font-weight: normal;
	display: inline-block;
	padding: 6px 10px;
	line-height: 1;
	margin:0 0 0 10px;
	letter-spacing: 1px;
}

#top_course [class*="c0"] ul{
	margin-top: 3px;
}

#top_course [class*="c0"] li{
	font-size: 12px;
	line-height: 1.6;
}

@media (min-width: 600px) {
	#top_course [class*="c0"] {
		margin-bottom: 30px;
	}

	#top_course h2{
		font-size:38px;
	}
	#top_course [class*="c0"] .c_name{
		font-size:20px;
		margin-top: 20px;
	}
	#top_course [class*="c0"] .c_name span{
		font-size:13px;
		padding: 6px 16px;
		margin:0 0 0 10px;
	}
	#top_course [class*="c0"] ul{
		margin-top: 10px;
	}
	#top_course [class*="c0"] li{
	font-size: 13px;

	}
}

@media (min-width: 992px) {
	#top_course h2{
		font-size:48px;
	}
}

	#top_course [class*="c0"]:last-child {
		margin-bottom: 0;
	}

#top_course [class*="c0"] a,
#top_course [class*="c0"] a:link,
#top_course [class*="c0"] a:visited,
#top_course [class*="c0"] a:hover{
	color: #333;
	text-decoration: none;
}

#top_course .c01 .c_name{ color:#F4BF71;}
#top_course .c02 .c_name{ color:#B489DE;}
#top_course .c03 .c_name{ color:#BE8341;}
#top_course .c04 .c_name{ color:#B09D86;}
#top_course .c05 .c_name{ color:#69C;}
#top_course .c06 .c_name{ color:#6DBA6D;}
#top_course .c07 .c_name{ color:#C1D951;}
#top_course .c08 .c_name{ color:#62B1CC;}
#top_course .c09 .c_name{ color:#949494;}

#top_course .c01 .c_name span{ background-color:#F4BF71; }
#top_course .c02 .c_name span{ background-color:#B489DE; }
#top_course .c03 .c_name span{ background-color:#BE8341; }
#top_course .c04 .c_name span{ background-color:#B09D86; }
#top_course .c05 .c_name span{ background-color:#69C; }
#top_course .c06 .c_name span{ background-color:#6DBA6D; }
#top_course .c07 .c_name span{ background-color:#C1D951; }
#top_course .c08 .c_name span{ background-color:#62B1CC; }
#top_course .c09 .c_name span{ background-color:#949494; }


/* Gナビのドロップダウン --------------*/

nav#g-nav .dropdown-menu.course{}

nav#g-nav .dropdown-menu.course ul{
	display:flex;
	flex-wrap: wrap;
	max-width:1140px;
	width: 100%;
	margin: 20px auto;
}
nav#g-nav .dropdown-menu.course li{
	width:20%;
	padding: 10px;
}
nav#g-nav .dropdown-menu.course li a{
	padding:0;
	border-bottom: 0;
}
nav#g-nav .dropdown-menu.course li a img{
	/*margin-bottom: 5px;*/
}

.mega .dropdown-menu{
	background-color: rgba(113,214,227,0.9)!important;
}

nav#g-nav .dropdown-menu.course .c00 .c_name{ background-color:#5BCFDE; }
nav#g-nav .dropdown-menu.course .c01 .c_name{ background-color:#F4BF71; }
nav#g-nav .dropdown-menu.course .c02 .c_name{ background-color:#B489DE; }
nav#g-nav .dropdown-menu.course .c03 .c_name{ background-color:#BE8341; }
nav#g-nav .dropdown-menu.course .c04 .c_name{ background-color:#B09D86; }
nav#g-nav .dropdown-menu.course .c05 .c_name{ background-color:#69C; }
nav#g-nav .dropdown-menu.course .c06 .c_name{ background-color:#6DBA6D; }
nav#g-nav .dropdown-menu.course .c07 .c_name{ background-color:#C1D951; }
nav#g-nav .dropdown-menu.course .c08 .c_name{ background-color:#62B1CC; }
nav#g-nav .dropdown-menu.course .c09 .c_name{ background-color:#949494; }

span.c00color{ color:#5BCFDE;}
span.c01color{ color:#F4BF71;}
span.c02color{ color:#B489DE;}
span.c03color{ color:#BE8341;}
span.c04color{ color:#B09D86;}
span.c05color{ color:#69C;}
span.c06color{ color:#6DBA6D;}
span.c07color{ color:#C1D951;}
span.c08color{ color:#62B1CC;}
span.c09color{ color:#949494;}

span.c_comment{ font-size:12px; background: rgba(255,255,255,1); width:112%; padding:0 6%; display:block; margin-left:-6%; margin-top:-3px;}
p.c_name_s{ font-size:12px; padding:0; margin:0;}
span.c05_text_s{ font-size:10px;}
.c_relative{ position:relative;}
p.c_new_red{ position:absolute; background-color:#FF0000; color:#FFFFFF; top:5px; right:5px; padding:2.5px 5px; font-size:10px; }
p.c_new_red_l{ position:absolute; background-color:#FF0000; color:#FFFFFF; top:15px; right:40px; padding:2.5px 5px; font-size:18px; z-index:999;}

nav#g-nav .dropdown-menu.course .c_name{
	color:#fff;
	padding: 3px 10px;
	font-size:14px;
}

/* ==============================================================
   # トップページ：ニュース
============================================================== */

#news-pickup{
	background-color: #ECF4FB;
}
#news-pickup h2,
#campuslife h2{
	background-color: #38A8EB;
	color:#fff;
	text-align: left;
	border-radius: 2px;
	margin-bottom: 15px;
	font-size:18px;
	font-weight: 900;
	padding: 15px;
}

@media (min-width: 768px) {
	#news-pickup h2,
	#campuslife h2{
		margin-bottom: 30px;
		font-size:24px;
		padding: 20px;
	}
}


#news-pickup .banner_area{
	margin-top:3rem;
}

.billborad-slider-news,
.billborad-slider-campuslife{
	opacity: 0;
}

.billboard-wrap{
	margin:0;
	margin-left: -20px;
	margin-right: -20px;
}

.news_box{
	position:relative;
	padding: 0 20px;
}
@media (min-width: 768px) {

	#news-pickup .banner_area{
		margin-top:4rem;
	}

	.news_box{
		margin-bottom:100px;
	}
}

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

.news_box .inner{
	background-color:#fff;
	padding: 2% 3%;
}

.news_box .inner .date{
	font-size:13px;
}

.news_box .inner .cat{
	background-color: #4191D8;
	color: #fff;
	font-size:11px;
	line-height: 1;
	padding: 1% 1%;
	display: inline-block;
	margin-left: 10px;
}
#campuslife .inner .flex {
	display: flex;
}
#campuslife .inner .date {
	width: 15%;
	display: inline-block;
}
#campuslife .inner .flex >div{
	width: 80%;
}
#campuslife .inner .flex >div span {
	border-bottom: 3px solid #fff;
}
#campuslife .inner .cat{
	background-color: #FAA649;
}

.news_box .inner p{
	margin:3px 0 0 0;
	font-weight: 900;
	font-size:16px;
}


@media (min-width: 768px) {
	.news_box .inner{
		position: absolute;
		right:20px;
		top: 85%;
		width: 80%;
		padding: 3% 3%;
	}
	.news_box .inner .date{
		font-size:13px;
	}
	.news_box .inner .cat{
		font-size:12px;
	}
	.news_box .inner p{
		font-size:16px;
	}
}

@media (min-width: 992px) {
	.news_box .inner .date{

	}
	.news_box .inner .cat{

	}
	.news_box .inner p{

	}

}


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

#news-pickup .btn,
#campuslife .btn{
	margin-top:30px;
}
@media (min-width: 768px) {
	#news-pickup .btn,
	#campuslife .btn{
		margin-top:0;
	}
}

.billboard-wrap a,
.billboard-wrap a:link,
.billboard-wrap a:visited,
.billboard-wrap a:hover{
	color:#333;
	text-decoration: none;
}

/* スライダーのやじるし 768以上だと消える ----------------*/

.arrows button,
.arrows02 button{
	position: relative;
}

.arrows,
.arrows02{
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
}

@media (min-width: 768px) {
	.arrows,
	.arrows02{
		display:none;
	}
}

/* サムネイル設定 ----------------*/

.thumbnail_box{
	width: 100%;
	height: 50vw;
	overflow: hidden;
	box-sizing: border-box;
}

.thumbnail_img {
	width: 100%;
	height: 50vw;
	display: block;
	background-position: center;
	background-size: cover;
	margin-bottom: 15px;
	transition-duration: 0.3s;
}

@media (min-width: 768px) {
	.thumbnail_box,
	.thumbnail_img{
		height: 27vw;
		max-height: 320px;
	}
}

@media (min-width: 993px) {
		.thumbnail_box,
		.thumbnail_img{
		}
	}

.thumbnail_img:hover {
	transform: scale(1.1);
}

.display{
	opacity:1 !important;
}

#news-pickup .thumbnail_box{
	background-color: #D8EAEF;
}
#campuslife .thumbnail_box{
	background-color: #f1e0d9;
}

/* ==============================================================
   # トップページ：キャンパスライフ
============================================================== */
#campuslife{
	background-color: #FBF5EB;
}
#campuslife h2{
	background-color: #F8804B;
}

@media (max-width: 575px) {
	#campuslife{
		padding-bottom:0;
	}
}

.campus_sns{
	background-color: #fff;
	border-radius: 8px;
	margin-top: 60px;
	margin-left:-20px;
	margin-right:-20px;
}

.campus_box,
.sns_box{
	position: relative;
}

.index .image_photo{
	display: none;
}

.sns_box ul{
	margin-top:20px;
}

.sns_box{
	padding: 20px;
	font-size:18px;
	font-weight: 900;
	line-height: 1.3;
}

.campus_box .btn a{
	position: absolute;
	bottom:5%;
	left: 5%;
	width:90%;
	max-width: 100%;
}

@media (min-width: 993px) {
	.campus_sns{
		display: flex;
		flex-wrap: nowrap;
		margin-left:0;
		margin-right:0;
	}
	.campus_box,
	.sns_box{
		width:50%;
	}
	.image_photo{
		display: block;
	}
	.sns_box ul{
		width: 60%;
	}
	.sns_box{
		margin: 2.5vw 2.5vw 2.5vw 0;
		padding:0 0 0 2.5vw;
		border-left:1px dotted #ddd;
	}
	.campus_box .btn a{
		position: absolute;
		bottom:2.5vw;
		right:2.5vw;
		left: auto;
		width:60%;
	}
}

.campus_box{
	background: url("../imgs/index/campus_bg_sp2.jpg") no-repeat center top;
	background-size: cover;
	height: 70vw;
}
@media (min-width: 993px) {
	.campus_box{
		background: url("../imgs/index/campus_bg2.jpg") no-repeat center top;
		background-size: cover;
		height: inherit;
	}
}

.campus_box .btn a{
	background-color: #FA4E8B;
}

.sns_box li a{
	background-color: #000;
	color: #fff;
	display: block;
	font-size:13px;
	padding: 9px;
	border-radius: 2px;
	letter-spacing: 1px;
	margin-bottom: 6px;
	text-align: center;
	position: relative;
}


@media (max-width: 992px) {
	.sns_box li a{
		padding: 15px;
	}
}

.sns_box li:last-child a{
	margin-bottom: 0;
}
/* 20251204 SNS並び替えと追加のため変更 */
.sns_box li:nth-child(1) a{	background-color: #00C300;}
.sns_box li:nth-child(2) a{	background-color: #C831C4;}
.sns_box li:nth-child(3) a{	background-color: #2DCCD3;}
.sns_box li:nth-child(4) a{	background-color: #FF3333;}
.sns_box li:nth-child(5) a{	background-color: #000;}

.sns_box li img{
	width:16px;
	height: 16px;
}

.sns_box li a i{
	position: absolute;
	left: 14px;
	top:50%;
	font-size:18px;
	margin-top:-9px;
}

#index .image_photo,
#index_demo .image_photo{
	display:none;
}


@media (min-width: 992px) {
	#index .image_photo,
	#index_demo .image_photo{
	position: absolute;
	right:-60px;
	bottom:-10px;
	max-width:250px;
	width: 19vw;
	height: auto;
		display: block;
	}
}

/* ==============================================================
   # トップページ：サポート
============================================================== */

#index .top_support_line,
#index_demo .top_support_line{
	display:none;
}

#top_support h3{
	border-bottom: 3px solid #8BCCF3;
	padding-bottom: 15px;
	margin-bottom: 20px;
	font-size:16px;
	font-weight: 900;
}

@media (min-width: 768px) {
	#top_support h3{
		margin-bottom: 50px;
		font-size:22px;
	}

	.banner_area ul{
		display: flex;
		flex-wrap: wrap;
		margin-left: -10px;
		margin-right:-10px;
	}

	.banner_area li{
		padding:0 10px 10px 10px;
		width: calc(100% / 3)
	}
}
@media (min-width: 768px) {
	.banner_area ul{
		margin-left: -15px;
		margin-right:-15px;
	}

	.banner_area li{
		padding:0 15px 10px 15px;
		width: calc(100% / 3)
	}
}

.text_link{
	display: block;
}

.text_link li{
	padding:5px 0;
	font-size:14px;
	font-weight: 900;
	background: url("../imgs/index/icon01.png") no-repeat center left 0;
	background-size: 20px;
	padding-left: 30px;
	line-height: 1.6;
}

@media (min-width: 993px) {

	.text_link ul{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		margin-left: -10px;
		margin-right:-10px;
	}
	.text_link li{
		padding:10px;
		width: calc(100% / 3);
		font-size:15px;
		font-weight: 900;
		background: url("../imgs/index/icon01.png") no-repeat center left 10px;
		background-size: 20px;
		padding-left: 40px;
		line-height: 1.6;
	}
}

@media (min-width: 1240px) {
	.text_link li{
	width: calc(100% / 4);
	}
}

.text_link li span{
	font-size:12px;
	font-weight: 500;
}

.text_link li a,
.text_link li a:link,
.text_link li a:hover,
.text_link li a:visited{
	color:#333;
	text-decoration: none;
}

.text_link li a:hover{
	text-decoration: underline;
}

.banner_area_ex li img{
	margin-bottom: 10px;
}

@media (min-width: 768px) {
	.banner_area_ex ul{
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-around;
		margin-left: -10px;
		margin-right:-10px;
	}
	.banner_area_ex li{
		padding: 10px;
	}
	.banner_area_ex li img{
	max-height: 180px;
	width: auto;
	}
}

.banner_area_ex{
	display:none;
}
#index .banner_area_ex,
#index_demo .banner_area_ex{
	display: block;
}