@charset "UTF-8";
/*layout*/
/*------------------------------------------------------------------------------*/
.inner {
	padding: 0;
	margin-left: auto;
	margin-right: auto;
	width: 95%;
}

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


/*荳句ｱ､蜈ｱ騾�*/
/*------------------------------------------------------------------------------*/
/*#contents {
	position: relative;
	background-color: #f6f6f6;
	color: #000;
	padding-bottom: 1px;
	margin-top: 70px;
}*/
.font01 {
	font-family: "貂ｸ譏取悃", YuMincho, "繝偵Λ繧ｮ繝取�譛� ProN W3", "Hiragino Mincho ProN", "HG譏取悃E", "�ｭ�ｳ �ｰ譏取悃", "�ｭ�ｳ 譏取悃", serif;
}



/*pagetitle*/
/*------------------------------------------------------------------------------*/

.subtitle02 {
	font-weight: bold;
	line-height:1.2;
	vertical-align: middle;
	display: table-cell;
	color: #FFF;
}
.subtitle02_in {
	display: inline-block;
}
.subtitle02 .main {
	font-size: 30px;
	margin-left: 70px;
}
.subtitle02 .font01 {
	display: block;
	text-align: right;
	font-size: 18px;
}

/*subtitle*/
/*------------------------------------------------------------------------------*/
.subtitle03_01 {
	font-size: 30px;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 32px;
	padding-bottom: 18px;
	border-bottom: 4px solid #ddd;
	position: relative;
	color: #545454;
}
.subtitle03_01:before {
	position: absolute;
	content: '';
	bottom: -4px;
	left: 0;
	background: #0074C1;
	width: 60px;
	height: 4px;
}
.subtitle03_02 {
	font-size: 22px;
	line-height: 1.2;
	color: #000;
	margin-bottom: 30px;
	padding-left: 18px;
	border-left: 5px solid #89C141;
}
.subtitle04_01 {
    color: #000;
    line-height: 1.2;
    margin-bottom: 30px;
    border-bottom: 1px dotted #DDD;
    padding-bottom: 30px;
    position: relative;
    padding-left: 60px;
}
.subtitle04_01 .main {
    font-size: 25px;
    display: inline-block;
    line-height: 1.2;
}
.subtitle04_01 .main:first-letter {
	color: #2989d8;
}
.subtitle04_01 .sub {
	display: inline-block;
	font-size: 16px;
}
.subtitle04_01 .sub:before {
	content: '／';
	color: #86BF3F;
	margin: 0 5px;
}
.subtitle04_01 .sub02 {
	display: block;
	font-size: 14px;
	margin-top: 5px;
}
@media only screen and (max-width: 970px) {
	.subtitle04_01 .main{
		font-size: 18px;
	}
}
@media only screen and (max-width: 690px) {
	.subtitle04_01 .main{
		font-size: 25px;
	}
}




/*number*/
/*------------------------------------------------------------------------------*/
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animation-fadeIn {
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
  opacity: 0;
}

.animation-fadeIn.is-animated {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

.shuffle {
	font-size: 120px;
	font-family: 'Oswald', sans-serif;
	line-height: 1;
}
#number01 .shuffle {
	width: 2em;
}
#number03 .shuffle {
	width: 1.5em;
}
#number04 .shuffle {
	width: 1.8em;
}
#number05 .shuffle {
	width: 1.8em;
}
#number06 .shuffle {
	width: 1.5em;
}
#number07 .shuffle {
	width: 1.8em;
}
@media only screen and (max-width: 979px) {
.shuffle {
	font-size: 100px;
	font-family: 'Oswald', sans-serif;
	line-height: 1;
}
.veoria .shuffle {
	font-size: 95px;
	font-family: 'Oswald', sans-serif;
	line-height: 1;
}
}

/*--------------------------
1繧ｫ繝ｩ繝�逕ｨ
---------------------------*/
.number_col1 {
	background: #FFF;
}
.number_col1 .inn_ {
	width: 95%;
	padding: 30px 0;
	margin: auto;
}
/*--------------------------
2繧ｫ繝ｩ繝�逕ｨ
---------------------------*/
.number_col2 {
    display: flex;
    justify-content: space-between;
}
.number_col2 .inn_ {
    width: 48%;
    padding: 30px 3%;
    background: #FFF;
}
@media only screen and (max-width: 690px) {
	.number_col2{
		flex-wrap: wrap;
	}
	.number_col2 .inn_{
		width: 100%;
	}
	.number_col2 .inn_ + .inn_{
		margin-top: 30px;
	}
}
/*--------------------------
3繧ｫ繝ｩ繝�逕ｨ
---------------------------*/
.number_col3 {
    display: flex;
    justify-content: space-between;
}
.number_col3 .inn_ {
    width: 31.5%;
    padding: 30px 3%;
    background: #FFF;
}
@media only screen and (max-width: 690px) {
	.number_col3{
		flex-wrap: wrap;
	}
	.number_col3 .inn_{
		width: 100%;
	}
	.number_col3 .inn_ + .inn_{
		margin-top: 30px;
	}

}

/*--------------------------
7：3
---------------------------*/

.number_col2_ti{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.number_col2_ti .sales{
	width: 65%;
	background-color: #fff;
	border-radius: 10px;
    padding: 30px 3%;
}

.number_col2_ti .sales .number{
	color: #fdba52;
}

.number_col2_ti .sales .shuffleNum{
	color: #fdba52;
}
.number_col2_ti .sales .number .sub02{
	color: #fdba52;
}

.number_col2_ti .m_w{
	width: 31.5%;
    padding: 30px 3%;
    background: #FFF;
	border-radius: 10px;
}

@media only screen and (max-width: 690px) {
.number_col2_ti .sales{
	width: 100%;
	margin-bottom: 30px;
}
.number_col2_ti .m_w{
	width: 100%;
	margin-bottom: 30px;
}
}


/*--------------------------
繝ｬ繧､繧｢繧ｦ繝亥�騾�
---------------------------*/
.number_col1 , 
.number_col2 .inn_ , 
.number_col3 .inn_ {
	border-radius: 10px;
}

/*--------------------------
ICON
---------------------------*/
.icon::before {
    content: "";
    display: block;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
}


.establish .icon::before{
	background: url(../other/icon_establ.svg)no-repeat center center /contain;
}
.sales .icon::before{
	background: url(../other/icon_sales.svg)no-repeat center center /contain;
}
.dealBlocks .icon::before{
	background: url(../other/icon_arrup.svg)no-repeat center center /contain;
}
.age .icon::before{
	background: url(../other/icon_calendar.svg)no-repeat center center /contain;
}
.m_w .icon::before{
	background: url(../other/icon_mw.svg)no-repeat center center /contain;
}
.Subject .icon::before{
	background: url(../other/icon_book.svg)no-repeat center center /contain;
}
.overhour .icon::before{
	background: url(../other/icon_time.svg)no-repeat center center /contain;
}
.holyday .icon::before{
	background: url(../other/icon_face.svg)no-repeat center center /contain;
}
.training .icon::before{
	background: url(../other/icon_bag.svg)no-repeat center center /contain;
}
.house .icon::before{
	background: url(../other/icon_house.svg)no-repeat center center /contain;
}
.hotspa .icon::before{
	background: url(../other/icon_hot.svg)no-repeat center center /contain;
}
.environment .subtitle04_01.icon::before{
	background: url(../other/icon_recycle.svg)no-repeat center center /contain;
}


/*--------------------------
繝翫Φ繝舌�
---------------------------*/
.number {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
.number .sub01 {
    font-size: 20px;
    line-height: 1.4;
}
.number .sub02 {
    font-size: 40px;
    font-weight: bold;
    line-height: 1;
}
#number001 {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
#number001 .sub01 {
    font-size: 20px;
    line-height: 1.4;
}
#number001 .sub02 {
    font-size: 50px;
    font-weight: bold;
    line-height: 1;
}

@media only screen and (max-width: 970px) {
	.number .sub02 {
	    font-size: 25px;
	}
}
@media only screen and (max-width: 690px) {
	.number .sub02 {
	    font-size: 40px;
	}
}


/*--------------------------
豈皮紫
---------------------------*/
.listrate{
	position: relative;
	display: flex;
	justify-content: space-between;
	-webkit-justify-content: space-between;
			justify-content: space-between;
				-ms-flex-pack: space-between;
}
.listrate li{
	width: 50%;
	text-align: center;
	list-style-type: none;
}
.listrate::before {
    content: ":";
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 70px;
    line-height: 1.2;
    transform: translate(-50%, -50%);
}
@media only screen and (max-width: 690px) {
	.listrate{
		justify-content: center;
	}
	.listrate li + li{
		margin-left: 40px;
	}
}

.leadtxt{
	font-size: 30px;
	font-weight: bold;
	line-height: 1.2;
	text-align: center;
}

/*--------------------------
險ｭ遶�
---------------------------*/
.establish{

}

/*--------------------------
螢ｲ荳�
---------------------------*/
.sales{
	position: relative;
	overflow: hidden;
}
.sales .ribbn {
    position: absolute;
    transform: rotate(-36deg);
    bottom: 60px;
    right: -145px;
    background-color: #e6e657;
    width: 490px;
    text-align: center;
    padding: 5px;
    font-weight: bold;
}

.veoria .ribbn {
    position: absolute;
    transform: rotate(-36deg);
    bottom: 35px;
    right: -170px;
    background-color: #e6e657;
    width: 490px;
    text-align: center;
    padding: 5px;
    font-weight: bold;
}
@media only screen and (max-width: 1049px) {
	.sales .ribbn,
	.veoria .ribbn{
		position: static;
		width: 100%;
		transform: rotate(0);
	}
}
/*--------------------------
螢ｲ荳頑ｯ皮紫
---------------------------*/
.dealBlocks .inn_ {
/*    align-items: flex-start;
    border-bottom: 2px solid #DDD;
    padding-bottom: 30px;
    margin-bottom: 30px;*/
}
.dealBlocks .charset {
    position: relative;
    width: 600px;
    margin: auto;
}
.dealBlocks .charset img {
	max-width: 500px;
    width: auto;
    height: auto;
}
.dealList {
}
.dealList li {
    position: absolute;
    list-style: none;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 3px 7px;
    text-align: center;
    border-radius: 5px;
    line-height: 1.2;
}
.dealList li.pin01 {
    top: 70px;
    right: 130px;
    color: #3578c4;
}
.dealList li.pin02 {
    top: 170px;
    right: 80px;
    color: #4bbfec;
}
.dealList li.pin03 {
    bottom: 150px;
    right: 80px;
    color: #73e3d6;
}
.dealList li.pin04 {
    bottom: 50px;
    right: 130px;
    color: #7ad36a;
}
.dealList li.pin05 {
    bottom: 50px;
    left: 160px;
    color: #e5e081;
}
.dealList li.pin06 {
    top: 200px;
    left: 90px;
    color: #b3b3b3;
}
.dealList li.pin07 {
    top: -10px;
    left: 160px;
    color: #f3a2da;
}
.dealList .num {
    display: block;
    font-size: 50px;
    font-weight: bold;
}
.dealList .num:after {
    content: "%";
    font-size: 20px;
}
.chartList {
    height: auto;
    border-radius: 5px;
    border: 1px solid #DDD;
    padding: 40px;
}
.chartList li {
    list-style-type: none;
    font-size: 24px;
}
.chartList .tit {
    width: 120px;
    display: inline-block;
    font-size: 15px;
}
@media only screen and (max-width: 690px) {
	.dealBlocks .charset {
	    width: auto;
	    margin: 0 auto 20px;
	}
	.dealBlocks .charset img{
		width: 200px;
		margin-bottom: 20px;
	}
	.dealList {
	    display: flex;
	    flex-wrap: wrap;
	    justify-content: center;
	}
	.dealList li{position: static; }
	.dealList .num{
		font-size: 30px;
	}

	.dealBlocks .charset .graph, 
	.chartList{
		display: none;
	}
}


/*蟷ｳ蝮�ｹｴ鮨｢
---------------------------*/
.age .subleadTitl {
    border: 1px solid #DDD;
    border-radius: 5px;
    text-align: center;
    padding: 8px;
}
.age .listrate::before{
	display: none;
}
/*.age .shuffle {
    font-size: 100px;
    line-height: 1;
}*/
.age .num{
    font-size: 40px;
    /*font-weight: bold;*/
    line-height: 1;
}
.age .sub02{
	font-size: 25px;
}
.age .listrate li.man {
    color: #2f9af7;
}
.age .listrate li.woman {
    color: #ff91cd;
}

/*逕ｷ螂ｳ豈�
---------------------------*/
.m_w .listrate::before{display: none; }
.m_w .listrate .male{
	color: #2f9af7;
}
.m_w .listrate .female{
	color: #ff91cd;
}
.material {
    font-size: 18px;
    display: flex;
    color: #FFF;
    justify-content: space-between;
    border-radius: 5px;
    width: 100%;
    overflow: hidden;
    height: 40px;
    align-items: center;
}
.material .blocks{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.material .male {
    width: 50%;
    background-color: #2f9af7;
}
.material .female {
    background-color: #ff91cd;
    width: 50%;
    text-align: center;
}

/*譁�ｳｻ逅�ｳｻ
---------------------------*/
.Subject .material .lang {
    background-color: #d6e07a;
    width: 50%;
}
.Subject .material .math {
    background-color: #467d3e;
    width: 50%;
}
.Subject .listrate .lang {
    color: #d6e07a;
}
.Subject .listrate .math {
    color: #467d3e;
}
@media only screen and (max-width: 970px) {
	.age .shuffle, .m_w .shuffle, .Subject .shuffle {
	    font-size: 8vw;
	}
}
@media only screen and (max-width: 690px) {
	.age .shuffle, .m_w .shuffle, .Subject .shuffle {
	    font-size: 100px;
	}
}



/*--------------------------
蟷ｳ蝮�ｮ区･ｭ譎る俣
---------------------------*/
.overhour .number {
    color: #be92de;
}

/*--------------------------
蟷ｴ髢謎ｼ第律
---------------------------*/
.holyday .number{
    color: #fdba52;
}

/*--------------------------
遐比ｿｮ繝ｻ蜃ｺ蠑ｵ縺ｧ陦後▲縺溷嵜縲�
---------------------------*/
.mapList{
	display: none;
}
@media only screen and (max-width: 690px) {
	figure.map{
		display: none;
	}
	.mapList{
		display: block;
	}
	.mapList li {
	    display: inline;
	    list-style-type: none;
	    font-size: 18px;
	    line-height: 1.6;
	    margin-right: 10px;
	    border-bottom: 1px solid;
	}
	.mapList li::before{
		content: "";
		display: inline-block;
		width: 10px;
		height: 10px;
	}
}

/*--------------------------
譌｢蟀夊€��謖∝ｮｶ菫晄怏邇�
---------------------------*/
.house .number {
    color: #b2ca59;
}
/*--------------------------
貂ｩ豕牙�豬ｴ蝗樊焚
---------------------------*/
.hotspa .number {
    color: #ff5454;
}





/*迺ｰ蠅�∈縺ｮ蜿悶ｊ邨�∩
---------------------------*/
.environment .iconList {
    display: flex;
    justify-content: space-between;
    max-width: 800px;
    margin: 0 auto 40px;
}
.environment .iconList li {
    list-style-type: none;
    width: 100%;
    height: 100%;
}
/*.environment .iconList li + li {
	margin-left: 15px;
}*/
.environment .iconList li img {
    width: 70px;
    height: 70px;
}
.environment .numblocks{
	display: flex;
	justify-content: center;
}
.environment .numblocks .col {
    text-align: center;
    flex-basis: 270px;
}
/*.environment .numblocks .col:last-child{
	margin-right: 0;
}*/
@media only screen and (max-width: 970px) {
	.environment  .fl{
	    display: flex;
	    justify-content: center;
	}
	.environment .iconList {
	    max-width: none;
	    display: flex;
	    justify-content: space-between;
	    flex-direction: column;
	    margin: 0;
	}
	.environment .iconList li{
		display: flex;
		align-items: center;
	}
	.environment .numblocks{
		flex-wrap: wrap;
		width: 270px;
	}
	.environment .numblocks .col{
		width: 100%;
	    flex-basis: auto;
	}
}
@media only screen and (max-width: 690px) {
	.environment .numblocks{
		width: 200px;
	}
	.environment .shuffle{
		font-size: 80px;
	}
}

#number001 {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	flex-wrap: wrap;
	color: #0877d9;
	margin-bottom: 20px;
}

#number001 .number {
	display: inline-block;
}
#number001 .wrap {
	font-size: 70px;
	font-weight: bold;
	line-height: 1;
}
#number001 .wrap .sub {
	display: block;
	font-size: 15px;
}

#number003 {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	color: #000;
	margin-bottom: 20px;
}
#number003 .wrap {
	font-size: 60px;
	font-weight: bold;
	line-height: 1;
}
@media only screen and (max-width: 690px) {
	#number003 .shuffle {
    font-size: 50px;
	}
	#number003 .wrap {
	    font-size: 30px;
	}
}

#number011 {
	color: #009FBB;
	margin-bottom: 20px;
}
#number011 .sub {
	font-size: 30px;
	font-weight: bold;
	line-height: 1;
}
#number012 {
	color: #FFA64D;
	margin-bottom: 20px;
}
#number012 .sub {
	font-size: 30px;
	font-weight: bold;
	line-height: 1;
}
#number013 {
	color: #FFCA00;
	margin-bottom: 20px;
}
#number013 .sub {
	font-size: 30px;
	font-weight: bold;
	line-height: 1;
}

@media only screen and (max-width: 690px) {
	#number011 .sub, #number012 .sub, #number013 .sub{
		font-size: 20px;
	}
}





/*animation*/
/*------------------------------------------------------------------------------*/
@-webkit-keyframes fadeInsmall {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInsmall {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.animation-fadeIn {
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: cubic-bezier(0.6, 0.2, 0.1, 1);
  animation-timing-function: cubic-bezier(0.6, 0.2, 0.1, 1);
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  opacity: 0;
}
.animation-fadeIn.is-animated {
  -webkit-animation-name: fadeInsmall;
  animation-name: fadeInsmall;
}

.animation-fadeIn.delay01 {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.animation-fadeIn.delay02 {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}
.animation-fadeIn.delay03 {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}
.animation-fadeIn.delay04 {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.8s;
}

@media only screen and (max-width: 1200px) {
.animation-fadeIn{opacity: 1; }
}
.br_tablet{ display:none;}
.br_sp{ display:none;}
.br_pc{ display:inline-block;}

@media only screen and (min-width:691px) and (max-width:1024px) {
.br_pc{ display:none;}
.br_sp{ display:none;}
.br_tablet{ display:inline-block;}
}

@media only screen and (max-width: 690px) {
.br_pc{ display:none;}
.br_tablet{ display:none;}
.br_sp{ display:inline-block;}
}