@charset "utf-8";


/* index1 */
#index1{padding: 0;}
#index1 .container{max-width: 1500px;padding: 0;}

.appeal-tb,.appeal-top,.appeal-bottom{display: table;width: 100%;table-layout: fixed;}
	@media (max-width:991px)	{.appeal-tb,.appeal-top,.appeal-bottom{display: block;}}

.appeal-left,.appeal-right{display: table-cell;width: 50%;vertical-align: middle;overflow: hidden;}
	@media (max-width:991px)	{.appeal-left,.appeal-right{display: block;width: 100%;}}


.appeal1,.appeal2,.appeal3,.appeal4,
.appeal1:hover,.appeal2:hover,.appeal3:hover,.appeal4:hover,
.appeal1:active,.appeal2:active,.appeal3:active,.appeal4:active,
.appeal1:focus,.appeal2:focus,.appeal3:focus,.appeal4:focus
{text-align: center;padding:30px 15px;}

.appeal4,.appeal4:hover,.appeal4:active,.appeal4:focus{padding-left: 50%;display: table-cell;vertical-align: middle;}


.appeal1,.appeal2,.appeal3,.appeal4{position: relative;}

.appeal1:hover,.appeal2:hover,.appeal3:hover,.appeal4:hover,
.appeal1:active,.appeal2:active,.appeal3:active,.appeal4:active,
.appeal1:focus,.appeal2:focus,.appeal3:focus,.appeal4:focus{opacity:.75;overflow: hidden;}


.appeal1 *,.appeal2 *,.appeal3 *,.appeal4 *{position: relative;z-index: 1;}


.appeal1 h2,.appeal2 h2,.appeal3 h2,.appeal4 h2{font-size: 16px;line-height: 1;margin-bottom: 15px;font-weight: bold;}

.appeal1,.appeal2,.appeal3,.appeal4,
.appeal1:hover,.appeal2:hover,.appeal3:hover,.appeal4:hover,
.appeal1:active,.appeal2:active,.appeal3:active,.appeal4:active,
.appeal1:focus,.appeal2:focus,.appeal3:focus,.appeal4:focus{color:#fff;text-shadow: 0 0 3px #000;}

.appeal2,.appeal3,.appeal4,
.appeal2:hover,.appeal3:hover,.appeal4:hover,
.appeal2:active,.appeal3:active,.appeal4:active,
.appeal2:focus,.appeal3:focus,.appeal4:focus{height: 300px;}

.appeal1:before,.appeal2:before,.appeal3:before,.appeal4:before{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-position: center center;background-size:cover;background-repeat: no-repeat;transform-origin:50% 50%;transform:scale(1.0);transition:.5s;}

.appeal1:before,.appeal1:hover:before,.appeal1:active:before,.appeal1:focus:before{background-image: url(../images/top/appeal1.jpg);height: 600px;}
.appeal2:before,.appeal2:hover:before,.appeal2:active:before,.appeal2:focus:before{background-image: url(../images/top/appeal2.jpg);}
.appeal3:before,.appeal3:hover:before,.appeal3:active:before,.appeal3:focus:before{background-image: url(../images/top/appeal3.jpg);}
.appeal4:before,.appeal4:hover:before,.appeal4:active:before,.appeal4:focus:before{background-image: url(../images/top/appeal4.jpg);}

	@media (max-width:991px)	{.appeal1,.appeal2,.appeal3,.appeal4,.appeal1:hover,.appeal2:hover,.appeal3:hover,.appeal4:hover,.appeal1:active,.appeal2:active,.appeal3:active,.appeal4:active,.appeal1:focus,.appeal2:focus,.appeal3:focus,.appeal4:focus{height: auto;}}

	@media (max-width:991px)	{.appeal4,.appeal4:hover,.appeal4:active,.appeal4:focus{display: block;padding-left: 15px;}}

.appeal1:hover:before,.appeal1:active:before,.appeal1:focus:before,
.appeal2:hover:before,.appeal2:active:before,.appeal2:focus:before,
.appeal3:hover:before,.appeal3:active:before,.appeal3:focus:before,
.appeal4:hover:before,.appeal4:active:before,.appeal4:focus:before{transform-origin:50% 50%;transform:scale(1.1);transition:.5s;}




.balloon{background: url(../images/common/bg-balloon.png) center center /contain no-repeat;color:#fff;width: 100px;height: 96px;margin: 0 auto 5px;font-size: 16px;line-height: 18px;padding: 25px 5px;text-shadow:none;}


section h2{text-align: center;font-size: 42px;margin-bottom: 75px;font-weight: normal}
	@media only screen and (max-width:991px)	{section h2{font-size: 24px;margin-bottom: 30px;}}

section h3{text-align: center;font-size: 18px;margin-bottom: 45px;font-weight: normal;}


#index2{}
#index2 h2{color:#000;}
	@media only screen and (max-width:991px)	{section h2{font-size: 24px;margin-bottom: 30px;}}

.appeal-box{display: flex;flex-flow:row wrap;border: 1px solid #666;}

.appeal{flex:1 1 25%;max-width: 25%;text-align: center;padding: 24px 9px 9px;}
	@media only screen and (max-width:991px)	{.appeal{flex:1 1 100%;max-width: 100%;}}

.appeal + .appeal{border-left: 1px solid #666;}
	@media only screen and (max-width:991px)	{.appeal + .appeal{border-left: none;border-top: 1px solid #666;}}

.appeal h3{font-size: 21px; font-weight:bold;line-height: 1;margin-bottom: 30px;}
.appeal h3 small{display: block;font-size: 12px;margin-top: 5px;}

.notes{font-size: 16px; line-height:1.75;color:#666;margin-top: 15px; margin-bottom:20px; text-align:left;}


#index3{}
#index3 h3{border-bottom: 1px solid #ddd;text-align: left;padding-bottom: 19px;font-size: 24px;margin-bottom: 30px;}
	@media only screen and (max-width:991px)	{#index3 h3{font-size: 21px;margin-bottom: 15px;padding-bottom: 9px;}}

#index3 h3 small{display: block;font-size: 12px;margin-bottom: 10px;}
	@media only screen and (max-width:991px)	{#index3 h3 small{font-size: 10px;margin-bottom: 5px;}}


.tit-mini{color:#666;}
.tit-light{color:#0093d3;position: relative;}
.tit-standard{color:#f4e603;}
.tit-advance{color:#cc006b;}




#index3 .balloon{width: 50px;height: 48px;text-align: center;font-size: 12px;line-height: 14px;padding: 7px 5px 10px;position: absolute;left: 180px;bottom: 10px;display: block;}
	@media only screen and (max-width:991px)	{#index3 .balloon{left: 150px;bottom: 5px;}}



.plan-tb{}
.plan-tb th,.plan-tb td{border-bottom: 1px solid #ddd;padding: 7px;}
.plan-tb th{font-weight: normal;}
.plan-tb td{color:#333;font-weight: bold;text-align: right;}

.plan-tb.total td{font-size: 30px;}
.plan-tb.total td small{font-size: 14px;}

#index4{background: url(../images/top/bg-index1.jpg) center center /cover no-repeat;}
	@media only screen and (max-width:991px)	{#index4{background: url(../images/top/bg-index1.jpg) 20% bottom /250% no-repeat;padding-bottom: 100%;}}

#index4 h2{color:#000;}

#index4 h3{text-align: left;font-weight: bold;color:#000;margin-bottom: 30px;}

#index5{background: url(../images/top/bg-index2.jpg) center center /cover no-repeat #67B57F;color:#fff;}
	@media only screen and (max-width:991px)	{#index5{background: url(../images/top/bg-index2.jpg) center center /cover no-repeat;}}

#index5 h2{color:#fff;text-align: left;font-size: 60px;font-weight: bold;margin-bottom: 30px;}
	@media only screen and (max-width:991px)	{#index5 h2{font-size: 29px;font-weight: bold;margin-bottom: 15px;}}

.index5-copy img{}
	@media only screen and (max-width:991px)	{.index5-copy img{width: 290px;height: auto;}}

#index5 .lead{font-size: 30px;line-height: 36px;margin: 30px 0;}
	@media only screen and (max-width:991px)	{#index5 .lead{font-size: 21px;line-height: 27px;margin: 15px 0;}}


.check{list-style: none;}
.check li{font-size: 18px;line-height: 48px;padding-left: 45px;padding-left: 48px;position: relative;}
	@media (max-width:991px)	{.check li{font-size: 16px;line-height: 24px;padding-left: 24px;}}

.check li:before{content: "";background: url(../images/common/checkmark.png) left center /30px no-repeat;width: 30px;height: 48px;display: block;position: absolute;top: 0;left: 0;right: 0;}
	@media (max-width:991px)	{.check li:before{width: 30px;height: 24px;background-size:20px;}}

.comment{font-size: 18px;line-height: 48px;padding-left: 45px;padding-left: 48px;position: relative;}
	@media (max-width:991px)	{.check li{font-size: 16px;line-height: 24px;padding-left: 24px;}}

#index6{}
#index6 h2{color:#000;}

#index6 h3{
	text-align: center;
	font-size: 20px;
	margin-bottom: 10px;
}
#index6 h3 small{font-size: 12px;display: block;color:#333;}

.point{color:#cc0033;}

#index7{}
#index7 h2{color:#000;}

.qabox{position: relative;word-wrap: break-word;background: #fff;}
	@media only screen and (max-width:991px)	{.qabox{}}

.qabox dt{background: #f6f6f6;display: block;position: relative;overflow: hidden;font-size: 24px;line-height: 30px;padding:45px 0 45px 60px;color:#67B57F;font-weight: normal;}
	@media only screen and (max-width:991px)	{.qabox dt{font-size: 15px;line-height: 1.25;padding:15px 0 15px 45px;}}

.qabox dt .container:before{content: "Q.";display: inline-block;width: 60px;font-size: 30px;margin-left: -60px;}
	@media only screen and (max-width:991px)	{.qabox dt .container:before{width: 45px;margin-left: -45px;}}


.qabox dd{background: #fff;display: block;position: relative;overflow: hidden;padding:45px 0 45px 60px;font-weight: normal;}
	@media only screen and (max-width:991px)	{.qabox dd{line-height: 1.25;padding:15px 0 15px 45px;}}

.qabox dd .container:before{content: "A.";display: inline-block;width: 60px;font-size: 30px;margin-left: -60px;color:#67B57F;}
	@media only screen and (max-width:991px)	{.qabox dd .container:before{width: 45px;margin-left: -45px;}}




.qabox dd p{margin-top: -25px;}

.qabox + .qabox{margin-top: 45px;}
	@media only screen and (max-width:767px)	{.qabox + .qabox{margin-top: 10px;}}

#index8{}
#index8 h2{color:#000;}

.news-box{}

.news-article{display: table;width: 100%;align-items:center;}
	@media only screen and (max-width:991px)	{.news-article{display: block;}}

.news-article + .news-article{margin-top: 15px;}

.news-date,.news-comment{display: table-cell;vertical-align: top;}
	@media only screen and (max-width:575px)	{.news-date,.news-comment{display: block;}}

.news-date{width: 110px;text-align: center;padding: 9px 0;}
	@media only screen and (max-width:991px)	{.news-date{width: auto;}}

.news-date.shp{border-bottom: 1px solid #f12795;}
.news-date.tpc{border-bottom: 1px solid #67B57F;}

.news-comment{border-bottom: 1px solid #999;padding: 9px 15px;}
	@media only screen and (max-width:991px)	{.news-comment{}}



#index9{}
#index9 h2{color:#000;}

#index10{}
#index10 h2{color:#fff;}

#index11{background: url(../images/top/bg-index3.jpg) center center /cover no-repeat #67B57F;color:#fff;}
	@media only screen and (max-width:991px)	{#index11{background: url(../images/top/bg-index3-sp.jpg) center center /cover no-repeat;padding-bottom: 90%;}}

#index11 h2{color:#fff;text-align: left;font-size: 60px;font-weight: bold;margin-bottom: 30px;}
	@media only screen and (max-width:991px)	{#index11 h2{font-size: 29px;font-weight: bold;margin-bottom: 15px;}}

.index11-copy img{}
	@media only screen and (max-width:991px)	{.index11-copy img{width: 290px;height: auto;}}

#index11 .lead{font-size: 30px;line-height: 36px;margin: 30px 0;}
	@media only screen and (max-width:991px)	{#index11 .lead{font-size: 21px;line-height: 27px;margin: 15px 0;}}


.check{list-style: none;}
.check li{font-size: 18px;line-height: 48px;padding-left: 45px;padding-left: 48px;position: relative;}
	@media (max-width:991px)	{.check li{font-size: 16px;line-height: 24px;padding-left: 24px;}}

.check li:before{content: "";background: url(../images/common/checkmark.png) left center /30px no-repeat;width: 30px;height: 48px;display: block;position: absolute;top: 0;left: 0;right: 0;}
	@media (max-width:991px)	{.check li:before{width: 30px;height: 24px;background-size:20px;}}

.comment{font-size: 18px;line-height: 48px;padding-left: 45px;padding-left: 48px;position: relative;}
	@media (max-width:991px)	{.check li{font-size: 16px;line-height: 18px;padding-left: 24px;}}
