@charset "UTF-8";
/*
 * graduate2019.css
 */

/*commmon*/
#cnt_main p { text-align: center; }
#pagetop { z-index: 10; }

#sec_1 {
	background-color: #fffafa;
}
#sec_1 .sec_in {
	text-align: center;
	z-index: 1;
}
#sec_1 h3 {
	margin: 60px auto 5px;
	position: relative;
	text-align: center;
}
#sec_1 h3 span{
	font-family: "Sawarabi Mincho",'Yu Mincho', 'YuMincho';
	font-size: 20px;
	display: inline-block;
}
/* #sec_1 h3:before {
	content: "";
	display: inline-block;
	position: absolute;
	background: url(../img/index/s1_icon1.png) center center /cover no-repeat;
	width: 62px;
	height: 56px;
	top: -20px;
	left: -30%;
} */
#sec_1 p.txt1 {
	font-family: "Sawarabi Mincho",'Yu Mincho', 'YuMincho';
	font-size: 34px;
	color: #f95d91;
	margin-bottom: 12px;
	position: relative;
	text-align: center;
}
#sec_1 p.txt1:before {
	content: "";
	background: url(../img/index/s1_bg1.png) center center /cover no-repeat;
	display: inline-block;
	vertical-align: middle;
	position: absolute;
	top: -90px;
	right: 45px;
	width: 168px;
	height: 264px;
}
#sec_1 p.txt1:after {
	content: url(../img/index/s1_bg2.png);
	display: inline-block;
	vertical-align: middle;
	position: absolute;
	top: 0;
	left: 45px;
}
#sec_1 .txtbox {
	width: 580px;
	width: 600px;
	margin: 0 auto;
	font-size: 15px;
	line-height: 1.6;
	position: relative;
}
#sec_1 .txtbox p {
	margin-bottom: 30px;
	text-align: left;
	text-align: justify;
	text-indent: 1em;
}
#sec_1 .txtbox:after {
	content: "";
	background: url(../img/index/s1_bg3.png) center center /cover no-repeat;
	display: inline-block;
	vertical-align: middle;
	position: absolute;
	bottom: 0;
	left: -120px;
	width: 110px;
	height: 144px;
}
#sec_1 p.img1 {
	margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
	#sec_1 h3 {
		font-size: 20px;
		margin: 60px auto 5px;
	}
	#sec_1 h3:before {
		background: url(../img/index/s1_icon1_m.png) center center /cover no-repeat;
		width: 55px;
		height: 55px;
		top: -52px;
		left: -15%;
	}
	#sec_1 p.txt1 {
		font-size: 30px;
		line-height: 1.3;
		letter-spacing: 1px;
	}
	#sec_1 p.txt1:before {
		top: -90px;
		right: -15%;
		z-index: -1;
	}
	#sec_1 p.txt1:after {
		display: none;
	}
	#sec_1 .txtbox {
		width: 90%;
		position: relative;
	}
	#sec_1 .txtbox:after {
		left: -12%;
		z-index: -1;
	}
	#sec_1 .txtbox p {
		text-align: justify;
		margin-bottom: 15px;
		z-index: 10;
	}
}

/*#sec_2,#sec_3共通*/
#sec_2.section,#sec_3.section { padding-top: 70px; padding-bottom: 70px; }
#sec_2 h3,#sec_3 h3 { margin-bottom: 20px; }
#sec_2 h3 img,#sec_3 h3 img { display: block; margin: 0 auto; }
@media screen and (max-width: 767px) {
	#sec_2.section,#sec_3.section { padding-top: 50px; padding-bottom: 50px; }
}

#sec_2 {
	background-color: #e5f5f6;
}
#sec_2 h3 img {
	width: 345px;
	height: 56px;
}
#sec_2 .txt1 {
	color: #009ba9;
	font-size: 22px;
}
#sec_2 .txt2 {
	font-size: 15px;
	position: relative;
}
#sec_2 .txt2:after {
	content: url(../img/index/s2_icon1.png);
	display: inline-block;
	vertical-align: middle;
	position: absolute;
	-webkit-transform: scale(0.5);
	transform: scale(0.5);
	top: 45px;
	left: 0;
	right: 0;
}
#sec_2 .box1 ul {
	box-sizing: border-box;
}
#sec_2 .box1 ul {
	width: 808px;
	margin: 70px auto 0;
}
#sec_2 .box1 ul li {
	float: left;
	width: 190px;
}
#sec_2 .box1 ul li:not(:last-child) {
	margin-right: 16px;
}
#sec_2 .box1 ul li img {
	border: solid 1px #b4b4b4;
	box-sizing: border-box;
	width: 190px;
	height: 130px;
}
#sec_2 .box1 ul li a {
	display: block;
	opacity: 1;
	transition: 0.2s;
	position: relative;
	margin-bottom: 10px;
}
#sec_2 .box1 ul li a:hover {
	opacity: .6;
}
#sec_2 .box1 .txt3 {
	font-size: 16px;
	text-decoration: none;
	font-weight: bold;
	position: absolute;
	bottom: 20px;
	left: 0;
	right: 0;
}
#sec_2 .box1 .txt4 {
	font-size: 14px;
}
@media screen and (max-width: 767px) {
	#sec_2 h3 img {
		width: 260px;
		height: auto;
	}
	#sec_2 .txt1 {
		line-height: 1.5;
		margin-bottom: 10px;
	}
	#sec_2 .txt2:after {
		top: 65px;
	}
	#sec_2 .box1 ul li {
		float: left;
		width: 49%;
	}
	#sec_2 .box1 ul li:not(:last-child) {
		margin-right: 0;
	}
	#sec_2 .box1 ul li:nth-child(odd) {
		margin-right: 2%;
	}
	#sec_2 .box1 ul li:nth-child(1),
	#sec_2 .box1 ul li:nth-child(2) {
		margin-bottom: 5%;
	}
	#sec_2 .box1 ul {
	width: 100%;
	margin: 55px auto 0;
	}
	#sec_2 .box1 ul li img {
	width: 100%;
	height: auto;
}
	#sec_2 .box1 .txt3 {
	font-size: 14px;
	bottom: 10px;
	}
	#sec_2 .box1 ul li a {
		margin-bottom: 5px;
	}
}


#sec_3 {
	-webkit-background-size: 60px 60px;
	-moz-background-size: 60px 60px;
	background-size: 60px 60px;
	background-color: #ffffff;
	background-image: -webkit-gradient(linear, 0 100%, 100% 0,color-stop(.25, #fcf8e5), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #fcf8e5),color-stop(.75, #fcf8e5), color-stop(.75, transparent),to(transparent));
	background-image: -webkit-linear-gradient(45deg, #fcf8e5 25%, transparent 25%,transparent 50%, #fcf8e5 50%, #fcf8e5 75%,transparent 75%, transparent);
	background-image: -moz-linear-gradient(45deg, #fcf8e5 25%, transparent 25%,transparent 50%, #fcf8e5 50%, #fcf8e5 75%,transparent 75%, transparent);
	background-image: -ms-linear-gradient(45deg, #fcf8e5 25%, transparent 25%,transparent 50%, #fcf8e5 50%, #fcf8e5 75%,transparent 75%, transparent);
	background-image: -o-linear-gradient(45deg, #fcf8e5 25%, transparent 25%,transparent 50%, #fcf8e5 50%, #fcf8e5 75%,transparent 75%, transparent);
	background-image: linear-gradient(45deg, #fcf8e5 25%, transparent 25%,transparent 50%, #fcf8e5 50%, #fcf8e5 75%,transparent 75%, transparent);
}
#sec_3 h3 img {
	width: 290px;
	height: 50px;
}
#sec_3 .txt1 {
	color: #dba700;
	font-size: 22px;
	position: relative;
	margin-bottom: 55px;
}
#sec_3 .txt1:after {
	content: url(../img/index/s3_icon1.png);
	display: inline-block;
	vertical-align: middle;
	position: absolute;
	-webkit-transform: scale(0.5);
	transform: scale(0.5);
	top: 45px;
	left: 0;
	right: 0;
}
#sec_3 .box1 ul {
	background-color: #fff;
	width: 808px;
	margin: 0 auto;
	padding: 25px 0;
	border: dashed 2px #dba700;
	font-size: 0;
	text-align: center;
}
#sec_3 .box1 ul li {
	display: inline-block;
}
#sec_3 .box1 ul li:not(:last-child) {
	margin-right: 10px;
}
#sec_3 .box1 ul li img {
	width: 246px;
	height: 124px;
}
#sec_3 .box1 ul li a {
	display: block;
	opacity: 1;
	transition: 0.2s;
}
#sec_3 .box1 ul li a:hover {
	opacity: .6;
}
@media screen and (max-width: 767px) {
	#sec_3 h3 img {
		width: 220px;
		height: auto;
	}
	#sec_3 .txt1 {
		line-height: 1.5;
	}
	#sec_3 .txt1:after {
		top: 105px;
	}
	#sec_3 .box1 ul {
		width: 100%;
	}
	#sec_3 .box1 ul li {
		display: block;
	}
	#sec_3 .box1 ul li:not(:last-child) {
		margin-right: 0;
		margin-bottom: 10px;
	}
}
