@charset "utf-8";

/* fadein
---------------------------------------------------- */
.fadein {
  opacity : 0;
  transform : translate(0, 30px);
  transition : all 1000ms;
}
.fadein.scrollin {
  opacity : 1;
  transform : translate(0, 0);
}


/* marker
---------------------------------------------------- */
.marker {
  background: linear-gradient(transparent 70%, rgba(244, 172, 48) 70%);
  display: inline;
  background-repeat: no-repeat;
  background-size: 0% 100%;
  transition: background-size 1.5s;
}
.marker.on {
  background-size: 100% 100%;
}
.marker2 {
  background: linear-gradient(transparent 95%, rgba(244, 172, 48) 95%);
  display: inline;
  background-repeat: no-repeat;
  background-size: 0% 100%;
  transition: background-size 1.5s;
}
.marker2.on {
  background-size: 100% 100%;
}


/* contents
---------------------------------------------------- */
.contents {
	width: 1140px;
	margin: 0 auto;
}


/* header
---------------------------------------------------- */
header {
	padding: 10px 50px;
	background-color: #FFF;
	min-width: 1140px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
}


/* mv
---------------------------------------------------- */
.mv {
	min-width: 1140px;
	padding: 80px 0;
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/mv_pc.jpg");
	background-position: center center;
	background-size: cover;
}
.mv p {
	font-size: 36px;
	font-family: 'YuGothB';
	color: #25579f;
	line-height: 1.5;
	padding-bottom: 40px;
}
.mv h1 {
	font-size: 48px;
	font-weight: normal;
	font-family: 'YuGothB';
	color: #333333;
	line-height: 1.5;
	padding-top: 90px;
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/pop.png");
	background-position: left top;
	background-repeat: no-repeat;
}
.mv a.btn_multi {
	display: inline-block;
	width: 523px;
	font-size: 24px;
	margin: 80px 0 0;
}
.mv a.btn_multi:nth-child(1) {
}
.mv a.btn_multi:nth-child(2) {
	margin-left: 70px;
}


/* btn
---------------------------------------------------- */
a.btn_multi {
	display: block;
	width: 673px;
	line-height: 77px;
	font-size: 30px;
	font-family: 'YuGothB';
	text-align: center;
	text-decoration: none;
	margin: 40px auto 0;
	color: #FFF;
	background-color: #f2c70f;
	border-radius: 50px;
	box-shadow: 5px 5px 0px 0px #d59629;
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/arr.png");
	background-position: right 30px center;
	background-repeat: no-repeat;
}
a.btn_multi.mail {
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/arr.png"), url("https://portal-keihi.bizutto.com/dcms_media/image/mail.png");
	background-position: right 30px center, left 30px center;
}
a.btn_multi.mate {
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/arr.png"), url("https://portal-keihi.bizutto.com/dcms_media/image/mate.png");
	background-position: right 30px center, left 30px center;
}
a.btn_multi:hover {
	opacity: 0.7;
}


/* check
---------------------------------------------------- */
.check {
	padding: 100px 0;
}
.check h2 {
	text-align: center;
	font-size: 60px;
	font-weight: normal;
	font-family: 'YuGothB';
	line-height: 1.5;
	margin-bottom: 50px;
}
.check h2 span span {
	color: #25579f;
}
.check ul {
	padding: 0 100px;
}
.check ul li {
	margin-top: 12px;
	font-size: 30px;
	line-height: 1.5;
	padding-left: 45px;
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/check.png");
	background-position: left top;
	background-repeat: no-repeat;
}
.cf:after {
	content: "";
	display: block;
	clear: both;
}

/* contact
---------------------------------------------------- */
.contact {
	text-align: center;
	padding: 80px 0;
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/contact.jpg");
	background-position: center center;
	background-size: cover;
}
.contact h2 {
	text-align: center;
	font-size: 36px;
	font-weight: normal;
	font-family: 'YuGothB';
	line-height: 1.5;
	margin-bottom: 30px;
}


/* worries
---------------------------------------------------- */
.worries {
	text-align: center;
	padding: 100px 0;
}
.worries h2 {
	text-align: center;
	font-size: 36px;
	font-weight: normal;
	font-family: 'YuGothB';
	line-height: 1.5;
	margin-bottom: 30px;
}
.worries h2 span {
	font-size: 48px;
	color: #25579f;
}
.worries ul {
	margin: 60px 0 0 -60px;
}
.worries ul li {
	float: left;
	width: 340px;
	text-align: left;
	margin-left: 60px;
}
.worries ul li img {
	display: block;
	margin: 0 auto 20px;
}
.worries ul li h3 {
	font-size: 30px;
	font-weight: normal;
	font-family: 'YuGothB';
	color: #f4ac30;
	text-align: center;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 3px solid #f4ac30;
}
.worries ul li p + p {
	margin-top: 25px;
}


/* leave
---------------------------------------------------- */
.leave {
	text-align: center;
	padding: 100px 0;
	background-color: #f4ac30;
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/arr1.png");
	background-position: center top;
	background-repeat: no-repeat;
}
.leave h2 {
	display: inline-block;
	padding: 0 100px;
	text-align: center;
	font-size: 36px;
	font-weight: normal;
	font-family: 'YuGothB';
	line-height: 1.4;
	color: #FFF;
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/line1.png"), url("https://portal-keihi.bizutto.com/dcms_media/image/line2.png");
	background-position: left center, right center;
	background-repeat: no-repeat;
}
.leave h2 span {
	font-size: 48px;
	color: #25579f;
}


/* point
---------------------------------------------------- */
.point {
	padding: 100px 0;
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/arr2.png");
	background-position: center top;
	background-repeat: no-repeat;
}
.point h2 {
	text-align: center;
	font-size: 36px;
	font-weight: normal;
	font-family: 'YuGothB';
	line-height: 1.5;
	color: #f4ac30;
}
.point img {
	display: block;
	margin: 40px auto 0;
}
.point ul li {
	margin-top: 50px;
}
.point ul li h3 {
	font-size: 30px;
	font-weight: normal;
	font-family: 'YuGothB';
	padding: 28px 0 28px 130px;
	margin-bottom: 25px;
	border-bottom: 3px solid #f4ac30;
	background-position: left center;
	background-repeat: no-repeat, repeat-y;
}
.point ul li:nth-child(1) h3 {
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/point01.png"), url("https://portal-keihi.bizutto.com/dcms_media/image/point_bg.jpg");
}
.point ul li:nth-child(2) h3 {
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/point02.png"), url("https://portal-keihi.bizutto.com/dcms_media/image/point_bg.jpg");
}
.point ul li:nth-child(3) h3 {
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/point03.png"), url("https://portal-keihi.bizutto.com/dcms_media/image/point_bg.jpg");
}


/* group
---------------------------------------------------- */
.group {
	padding: 100px 0;
}
.group h2 {
	text-align: center;
	font-size: 48px;
	font-weight: normal;
	font-family: 'YuGothB';
	line-height: 1.3;
}
.group h2 span {
	color: #f4ac30;
}
.group h2 + img {
	display: block;
	margin: 40px auto 60px;
}
.group ul {
	margin-left: -40px;
}
.group ul li {
	float: left;
	width: 550px;
	margin-left: 40px;
	padding: 30px 20px 80px;
	background-color: #f2f2f2;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	position: relative;
}
.group ul li .case {
	margin-bottom: 30px;
}
.group ul li .case img {
	display: inline-block;
	vertical-align: middle;
}
.group ul li .case p {
	font-size: 30px;
	vertical-align: middle;
	display: inline-block;
	font-family: 'YuGothB';
}
.group ul li .case p span {
	display: block;
	font-size: 18px;
}
.group ul li h3 {
	font-size: 30px;
	font-family: 'YuGothB';
	font-weight: normal;
	color: #f4ac30;
}
.group ul li dl {
  display: flex;
  flex-wrap: wrap;
}
.group ul li dl dt {
  width: 20%;
	font-family: 'YuGothB';
	margin-top: 20px;
}
.group ul li dl dd {
  width: 80%;
	margin-top: 20px;
}
.group ul li a.btn_multi {
	position: absolute;
	width: 382px;
	line-height: 60px;
	font-size: 24px;
	background-color: #618fd2;
	bottom: -30px;
	left: 50%;
	margin-left: -191px;
	box-shadow: 5px 5px 0px 0px #25579f;
}


/* charm
---------------------------------------------------- */
.charm {
	padding: 100px 0;
	background-color: #f4ac30;
}
.charm h2 {
	text-align: center;
	font-size: 48px;
	font-weight: normal;
	font-family: 'YuGothB';
	line-height: 1.3;
	margin-bottom: 40px;
	color: #FFF;
}
.charm h2 span {
	color: #25579f;
}
.charm ul {
	padding: 0 100px;
}
.charm ul li {
	margin-top: 12px;
	font-size: 24px;
	color: #FFF;
	line-height: 2;
	padding-left: 45px;
	font-family: 'YuGothB';
	background-image: url("https://portal-keihi.bizutto.com/dcms_media/image/check.png");
	background-position: left top;
	background-repeat: no-repeat;
}
.charm a.btn_multi {
	background-color: #618fd2;
	box-shadow: 5px 5px 0px 0px #25579f;
}
.charm p {
	text-align: center;
	color: #FFF;
	margin-top: 50px;
	font-size: 26px;
	font-family: 'YuGothB';
}
.charm p a {
	color: #25579f;
	font-size: 18px;
	text-decoration: underline;
}


/* page_top
---------------------------------------------------- */
#page_top {
	width: 60px;
	height: 60px;
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 10000;
}
#page_top a {
	display: block;
	width: 60px;
	height: 60px;
}
#page_top a img {
	width: 60px;
	height: 60px;
}


@media screen and (min-width:691px) and ( max-width:979px) {

/* contents
---------------------------------------------------- */
.contents {
	width: 95%;
}


/* header
---------------------------------------------------- */
header {
	min-width: 100%;
}


/* mv
---------------------------------------------------- */
.mv {
	min-width: 100%;
	padding: 50px 0;
	background-size: 120% auto;
	background-position: center top;
	background-repeat: no-repeat;
}
.mv a.btn {
	width: 80%;
	display: block;
	margin: 70px auto 0;
}
.mv a.btn:nth-child(2) {
	margin: 30px auto 0;
}


/* btn
---------------------------------------------------- */
a.btn {
	width: 70%;
}


/* check
---------------------------------------------------- */
.check h2 {
	font-size: 45px;
}
.check ul {
	padding: 0;
}


/* contact
---------------------------------------------------- */
.contact h2 {
	font-size: 30px;
}


/* worries
---------------------------------------------------- */
.worries img {
	width: 100%;
}
.worries ul {
	margin: 60px 0 0 -3%;
}
.worries ul li {
	width: 30.33333%;
	margin-left: 3%;
}
.worries ul li img {
	width: 80%;
}
.worries ul li h3 {
	font-size: 22px;
}


/* leave
---------------------------------------------------- */
.leave h2 {
	font-size: 32px;
}
.leave h2 span {
	font-size: 44px;
}


/* group
---------------------------------------------------- */
.group h2 {
	font-size: 40px;
}
.group h2 + img {
	width: 100%;
}
.group ul {
	margin-left: -3%;
}
.group ul li {
	width: 47%;
	margin-left: 3%;
}
.group ul li .case {
	margin-bottom: 30px;
}
.group ul li .case img {
	display: block;
	margin-bottom: 15px;
}
.group ul li .case p {
	font-size: 25px;
}
.group ul li .case p span {
	font-size: 16px;
}
.group ul li h3 {
	font-size: 26px;
	line-height: 1.4;
}
.group ul li dl dt {
  width: 25%;
}
.group ul li dl dd {
  width: 75%;
}
.group ul li a.btn {
	width: 90%;
	bottom: -30px;
	left: 5%;
	margin-left: 0;
}


/* charm
---------------------------------------------------- */
.charm h2 {
	font-size: 45px;
}
.charm ul {
	padding: 0;
}

}


@media only screen and (max-width: 690px) {

/* contents
---------------------------------------------------- */
.contents {
	width: 95%;
}


/* header
---------------------------------------------------- */
header {
	padding: 10px 25px;
	min-width: 100%;
	height: 50px;
}
header img {
	height: 30px;
}


/* mv
---------------------------------------------------- */
.mv {
	min-width: 100%;
	padding: 15px 0;
	background-size: 100% auto;
	background-position: center top;
	background-repeat: no-repeat;
}
.mv p {
	font-size: 16px;
	padding-bottom: 20px;
}
.mv h1 {
	font-size: 22px;
	padding-top: 42px;
	background-size: 100px auto;
	background-position: left top;
	background-repeat: no-repeat;
}
.mv a.btn {
	display: inline-block;
	width: 100%;
	font-size: 18px;
	margin: 25px auto 0;
}
.mv a.btn:nth-child(2) {
	margin: 20px auto 0;
}


/* btn
---------------------------------------------------- */
a.btn {
	width: 90%;
	line-height: 50px;
	font-size: 18px;
	margin: 25px auto 0;
	background-position: right 20px center;
}
a.btn.mail {
	background-size: auto, 30px auto;
	background-position: right 10px center, left 20px center;
}
a.btn.mate {
	background-size: auto, 30px auto;
	background-position: right 10px center, left 20px center;
}


/* check
---------------------------------------------------- */
.check {
	padding: 50px 0;
}
.check h2 {
	font-size: 24px;
	margin-bottom: 30px;
}
.check ul {
	padding: 0;
}
.check ul li {
	margin-top: 10px;
	font-size: 18px;
	padding-left: 30px;
	background-size: 22px auto;
}


/* contact
---------------------------------------------------- */
.contact {
	padding: 40px 0;
}
.contact img {
	width: 60%;
}
.contact h2 {
	font-size: 22px;
	margin-bottom: 20px;
}


/* worries
---------------------------------------------------- */
.worries {
	padding: 50px 0;
}
.worries h2 {
	font-size: 24px;
	margin-bottom: 30px;
}
.worries h2 span {
	font-size: 32px;
}
.worries img {
	width: 100%;
}
.worries ul {
	margin: 0;
}
.worries ul li {
	float: none;
	width: 100%;
	margin: 20px 0 0;
}
.worries ul li img {
	width: 30%;
	margin: 0 auto 5px;
}
.worries ul li h3 {
	font-size: 22px;
}
.worries ul li p + p {
	margin-top: 20px;
}


/* leave
---------------------------------------------------- */
.leave {
	padding: 50px 0 30px;
	background-size: 100px auto;
}
.leave h2 {
	padding: 0 40px;
	font-size: 20px;
	background-size: 30px auto;
}
.leave h2 span {
	font-size: 25px;
}


/* point
---------------------------------------------------- */
.point {
	padding: 50px 0;
	background-size: 100px auto;
}
.point h2 {
	font-size: 24px;
}
.point img {
	width: 100%;
	margin: 20px auto 0;
}
.point ul li {
	margin-top: 30px;
}
.point ul li h3 {
	font-size: 18px;
	padding: 15px 0 15px 80px;
	background-size: 60px auto;
}


/* group
---------------------------------------------------- */
.group {
	padding: 50px 0;
}
.group h2 {
	font-size: 24px;
}
.group h2 + img {
	width: 100%;
	margin: 30px auto 0;
}
.group ul {
	margin: 0;
}
.group ul li {
	float: none;
	width: 100%;
	margin: 30px 0 0;
	padding: 20px 20px 30px;
}
.group ul li .case {
	margin-bottom: 20px;
}
.group ul li .case img {
	width: 60px;
}
.group ul li .case p {
	font-size: 20px;
}
.group ul li .case p span {
	font-size: 12px;
}
.group ul li h3 {
	font-size: 18px;
}
.group ul li dl dt {
  width: 25%;
}
.group ul li dl dd {
  width: 75%;
}
.group ul li a.btn {
	position: inherit;
	width: 100%;
	line-height: 50px;
	font-size: 18px;
	bottom: 0;
	left: 0;
	margin-left: 0;
}


/* charm
---------------------------------------------------- */
.charm {
	padding: 50px 0;
}
.charm h2 {
	font-size: 24px;
	margin-bottom: 30px;
}
.charm ul {
	padding: 0 0;
}
.charm ul li {
	margin-top: 10px;
	font-size: 18px;
	line-height: 1.4;
	padding-left: 30px;
	background-size: 22px auto;
	background-position: left top -1px;
}
.charm p {
	margin-top: 40px;
	font-size: 22px;
}
.charm p a {
	font-size: 16px;
}


/* page_top
---------------------------------------------------- */
#page_top {
	width: 50px;
	height: 50px;
	bottom: 10px;
	right: 10px;
}
#page_top a {
	width: 50px;
	height: 50px;
}
#page_top a img {
	width: 50px;
	height: 50px;
}

	
}