@charset "UTF-8";



/* @group Font-Size */
.Text90 {font-size: 9.0em !important;}
.Text80 {font-size: 8.0em !important;}
.Text70 {font-size: 7.0em !important;}
.Text60 {font-size: 6.0em !important;}
.Text58 {font-size: 5.8em !important;}
.Text56 {font-size: 5.6em !important;}
.Text54 {font-size: 5.4em !important;}
.Text48 {font-size: 4.8em !important;}
.Text42 {font-size: 4.2em !important;}
.Text40 {font-size: 4.0em !important;}
.Text32 {font-size: 3.2em !important;}
.Text30 {font-size: 3.0em !important;}
.Text29 {font-size: 2.9em !important;}
.Text28 {font-size: 2.8em !important;}
.Text27 {font-size: 2.7em !important;}
.Text26 {font-size: 2.6em !important;}
.Text25 {font-size: 2.5em !important;}
.Text24 {font-size: 2.4em !important;}
.Text23 {font-size: 2.3em !important;}
.Text22 {font-size: 2.2em !important;}
.Text21 {font-size: 2.1em !important;}
.Text20 {font-size: 2.0em !important;}
.Text19 {font-size: 1.9em !important;}
.Text18 {font-size: 1.8em !important;}
.Text17 {font-size: 1.7em !important;}
.Text16 {font-size: 1.6em !important;}
.Text15 {font-size: 1.5em !important;}
.Text14 {font-size: 1.4em !important;}
.Text13 {font-size: 1.3em !important;}
.Text12 {font-size: 1.2em !important;}
.Text11 {font-size: 1.1em !important;}
.Text10 {font-size: 1.0em !important;}
.Text09 {font-size: 0.9em !important;}
.Text08 {font-size: 0.8em !important;}
.Text07 {font-size: 0.7em !important;}
.Text06 {font-size: 0.6em !important;}
.Text05 {font-size: 0.5em !important;}
.Text04 {font-size: 0.4em !important;}

/* Line-Height */

.LineH30 {line-height: 3.0em !important;}
.LineH28 {line-height: 2.8em !important;}
.LineH26 {line-height: 2.6em !important;}
.LineH24 {line-height: 2.4em !important;}
.LineH22 {line-height: 2.2em !important;}	
.LineH20 {line-height: 2.0em !important;}
.LineH19 {line-height: 1.9em !important;}	 
.LineH18 {line-height: 1.8em !important;}
.LineH17 {line-height: 1.7em !important;}
.LineH16 {line-height: 1.6em !important;}
.LineH15 {line-height: 1.5em !important;}
.LineH14 {line-height: 1.4em !important;}
.LineH13 {line-height: 1.3em !important;}
.LineH12 {line-height: 1.2em !important;}
.LineH11 {line-height: 1.1em !important;}
.LineH10 {line-height: 1.0em !important;}
.LineH09 {line-height: 0.9em !important;}
.LineH08 {line-height: 0.8em !important;}
.LineH07 {line-height: 0.7em !important;}
.LineH06 {line-height: 0.6em !important;}

/* Font Weight */
.FTW-B {font-weight: bold !important;}
.FTW100 {font-weight: 100 !important;}
.FTW200 {font-weight: 200 !important;}
.FTW300 {font-weight: 300 !important;}
.FTW400 {font-weight: 400 !important;}
.FTW500 {font-weight: 500 !important;}
.FTW600 {font-weight: 600 !important;}
.FTW700 {font-weight: 700 !important;}
.FTW800 {font-weight: 800 !important;}
.FTW900 {font-weight: 900 !important;}

/* Text Align */

.Aln-R {text-align: right;}
.Aln-L {text-align: left;}
.Aln-C {text-align: center;}
/* @end */


/* @group パディング */
.noPddT {padding-top:0 !important;}
.noPddB {padding-bottom:0 !important;}
.noPdd {padding:0 !important;}
.Pdd5 {padding:5px;}
.PddT5 {padding-top:5px;}
.PddR5 {padding-right:5px;}
.PddB5 {padding-bottom:5px;}
.PddL5 {padding-left:5px;}
.Pdd10 {padding:10px;}
.PddT10 {padding-top:10px;}
.PddR10 {padding-right:10px;}
.PddB10 {padding-bottom:10px;}
.PddL10 {padding-left:10px;}
.Pdd15 {padding:15px;}
.PddT15 {padding-top:15px;}
.PddR15 {padding-right:15px;}
.PddB15 {padding-bottom:15px;}
.PddL15 {padding-left:15px;}
.Pdd20 {padding:20px;}
.PddT20 {padding-top:20px;}
.PddR20 {padding-right:20px;}
.PddB20 {padding-bottom: 20px;}
.PddL20 {padding-left:20px;}
.Pdd25 {padding:25px;}
.PddT25 {padding-top:25px;}
.PddR25 {padding-right:25px;}
.PddB25 {padding-bottom: 25px;}
.PddL25 {padding-left:25px;}
.Pdd30 {padding: 30px;}
.PddT30 {padding-top: 30px;}
.PddB30 {padding-bottom:30px;}
.PddR30 {padding-right: 30px;}
.PddL30 {padding-left: 30px;}
.Pdd35 {padding: 35px;}
.PddT35 {padding-top: 35px;}
.PddB35 {padding-bottom:35px;}
.PddR35 {padding-right: 35px;}
.PddL35 {padding-left: 35px;}
.Pdd40 {padding: 40px;}
.PddT40 {padding-top: 40px;}
.PddB40 {padding-bottom:40px;}
.PddR40 {padding-right: 40px;}
.PddL40 {padding-left: 40px;}
.Pdd45 {padding: 45px;}
.PddT45 {padding-top: 45px;}
.PddB45 {padding-bottom:45px;}
.PddR45 {padding-right: 45px;}
.PddL45 {padding-left: 45px;}
.Pdd50 {padding: 50px;}
.PddT50 {padding-top: 50px;}
.PddB50 {padding-bottom:50px;}
.PddR50 {padding-right: 50px;}
.PddL50 {padding-left: 50px;}
.Pdd60 {padding: 60px;}
.PddT60 {padding-top: 60px;}
.PddB60 {padding-bottom:60px;}
.PddR60 {padding-right: 60px;}
.PddL60 {padding-left: 60px;}
.Pdd70 {padding: 70px;}
.PddT70 {padding-top: 70px;}
.PddB70 {padding-bottom:70px;}
.PddR70 {padding-right: 70px;}
.PddL70 {padding-left: 70px;}
.Pdd80 {padding: 80px;}
.PddT80 {padding-top: 80px;}
.PddB80 {padding-bottom:80px;}
.PddR80 {padding-right: 80px;}
.PddL80 {padding-left: 80px;}
.Pdd90 {padding: 90px;}
.PddT90 {padding-top: 90px;}
.PddB90 {padding-bottom:90px;}
.PddR90 {padding-right: 90px;}
.PddL90 {padding-left: 90px;}
.Pdd100 {padding: 100px;}
.PddT100 {padding-top: 100px;}
.PddB100 {padding-bottom:100px;}
.PddR100 {padding-right: 100px;}
.PddL100 {padding-left: 100px;}
.Pdd110 {padding: 110px;}
.PddT110 {padding-top: 110px;}
.PddB110 {padding-bottom:110px;}
.PddR110 {padding-right: 110px;}
.PddL110 {padding-left: 110px;}
.Pdd120 {padding: 120px;}
.PddT120 {padding-top: 120px;}
.PddB120 {padding-bottom:120px;}
.PddR120 {padding-right: 120px;}
.PddL120 {padding-left: 120px;}
.PddT130 {padding-top: 130px;}
.PddB130 {padding-bottom: 130px;}
.PddR130 {padding-right: 130px;}
.PddL130 {padding-left: 130px;}
.PddT140 {padding-top: 140px;}
.PddB140 {padding-bottom: 140px;}
.PddR140 {padding-right: 140px;}
.PddL140 {padding-left: 140px;}
.PddT150 {padding-top: 150px;}
.PddB150 {padding-bottom: 150px;}
.PddR150 {padding-right: 150px;}
.PddL150 {padding-left: 150px;}
.PddT160 {padding-top: 160px;}
.PddB160 {padding-bottom: 160px;}
.PddR160 {padding-right: 160px;}
.PddL160 {padding-left: 160px;}
.PddT170 {padding-top: 170px;}
.PddB170 {padding-bottom: 170px;}
.PddR170 {padding-right: 170px;}
.PddL170 {padding-left: 170px;}
.PddT180 {padding-top: 180px;}
.PddB180 {padding-bottom: 180px;}
.PddR180 {padding-right: 180px;}
.PddL180 {padding-left: 180px;}
.PddT190 {padding-top: 190px;}
.PddB190 {padding-bottom: 190px;}
.PddR190 {padding-right: 190px;}
.PddL190 {padding-left: 190px;}
.PddT200 {padding-top: 200px;}
.PddB200 {padding-bottom: 200px;}
.PddR200 {padding-right: 200px;}
.PddL200 {padding-left: 200px;}
/* @end */


/* @group マージン */

.noMrg {margin:0;}
.MrgSideAuto  {margin: 0 auto;}
.noMrgT {margin-top:0 !important;}
.noMrgB {margin-bottom:0 !important;}
.MrgL3 {margin-left:3px;}
.Mrg5 {margin:5px;}
.MrgT5 {margin-top:5px;}
.MrgR5 {margin-right:5px;}
.MrgB5 {margin-bottom:5px;}
.MrgL5 {margin-left:5px;}
.Mrg10 {margin:10px;}
.MrgT10 {margin-top:10px;}
.MrgR10 {margin-right:10px;}
.MrgB10 {margin-bottom:10px;}
.MrgL10 {margin-left:10px;}
.Mrg15 {margin:15px;}
.MrgT15 {margin-top:15px;}
.MrgR15 {margin-right:15px;}
.MrgB15 {margin-bottom:15px;}
.MrgL15 {margin-left:15px;}
.Mrg20 {margin:20px;}
.MrgT20 {margin-top:20px;}
.MrgR20 {margin-right:20px;}
.MrgB20 {margin-bottom:20px;}
.MrgL20 {margin-left:20px;}
.Mrg25 {margin:25px;}
.MrgT25 {margin-top:25px;}
.MrgR25 {margin-right:25px;}
.MrgB25 {margin-bottom:25px;}
.MrgL25 {margin-left:25px;}
.Mrg30 {margin:30px;}
.MrgT30 {margin-top:30px;}
.MrgR30 {margin-right:30px;}
.MrgB30 {margin-bottom:30px;}
.MrgL30 {margin-left:30px;}
.Mrg35 {margin:35px;}
.MrgT35 {margin-top:35px;}
.MrgR35 {margin-right:35px;}
.MrgB35 {margin-bottom:35px;}
.MrgL35 {margin-left:35px;}
.Mrg40 {margin:40px;}
.MrgT40 {margin-top:40px;}
.MrgR40 {margin-right:40px;}
.MrgB40 {margin-bottom:40px;}
.MrgL40 {margin-left:40px;}
.Mrg45 {margin:45px;}
.MrgT45 {margin-top:45px;}
.MrgR45 {margin-right:45px;}
.MrgB45 {margin-bottom:45px;}
.MrgL45 {margin-left:45px;}
.Mrg50 {margin:50px;}
.MrgT50 {margin-top:50px;}
.MrgR50 {margin-right:50px;}
.MrgB50 {margin-bottom:50px;}
.MrgL50 {margin-left:50px;}
.Mrg55 {margin:55px;}
.MrgT55 {margin-top:55px;}
.MrgR55 {margin-right:55px;}
.MrgB55 {margin-bottom:55px;}
.MrgL55 {margin-left:55px;}
.Mrg60 {margin:60px;}
.MrgT60 {margin-top:60px;}
.MrgR60 {margin-right:60px;}
.MrgB60 {margin-bottom:60px;}
.MrgL60 {margin-left:60px;}
.Mrg65 {margin:65px;}
.MrgT65 {margin-top:65px;}
.MrgR65 {margin-right:65px;}
.MrgB65 {margin-bottom:65px;}
.MrgL65 {margin-left:65px;}
.Mrg70 {margin:70px;}
.MrgT70 {margin-top:70px;}
.MrgR70 {margin-right:70px;}
.MrgB70 {margin-bottom:70px;}
.MrgL70 {margin-left:70px;}
.Mrg75 {margin:75px;}
.MrgT75 {margin-top:75px;}
.MrgR75 {margin-right:75px;}
.MrgB75 {margin-bottom:75px;}
.MrgL75 {margin-left:75px;}
.Mrg80 {margin:80px;}
.MrgT80 {margin-top:80px;}
.MrgR80 {margin-right:80px;}
.MrgB80 {margin-bottom:80px;}
.MrgL80 {margin-left:80px;}
.Mrg85 {margin:85px;}
.MrgT85 {margin-top:85px;}
.MrgR85 {margin-right:85px;}
.MrgB85 {margin-bottom:85px;}
.MrgL85 {margin-left:85px;}
.Mrg90 {margin:90px;}
.MrgT90 {margin-top:90px;}
.MrgR90 {margin-right:90px;}
.MrgB90 {margin-bottom:90px;}
.MrgL90 {margin-left:90px;}
.Mrg95 {margin:95px;}
.MrgT95 {margin-top:95px;}
.MrgR95 {margin-right:95px;}
.MrgB95 {margin-bottom:95px;}
.MrgL95 {margin-left:95px;}
.Mrg100 {margin:100px;}
.MrgT100 {margin-top:100px;}
.MrgR100 {margin-right:100px;}
.MrgB100 {margin-bottom:100px;}
.MrgL100 {margin-left:100px;}
.Mrg110 {margin:110px;}
.MrgT110 {margin-top:110px;}
.MrgR110 {margin-right:110px;}
.MrgB110 {margin-bottom:110px;}
.MrgL110 {margin-left:110px;}
.Mrg120 {margin:120px;}
.MrgT120 {margin-top:120px;}
.MrgR120 {margin-right:120px;}
.MrgB120 {margin-bottom:120px;}
.MrgL120 {margin-left:120px;}
.Mrg130 {margin:130px;}
.MrgT130 {margin-top:130px;}
.MrgR130 {margin-right:130px;}
.MrgB130 {margin-bottom:130px;}
.MrgL130 {margin-left:130px;}
.Mrg140 {margin:140px;}
.MrgT140 {margin-top:140px;}
.MrgR140 {margin-right:140px;}
.MrgB140 {margin-bottom:140px;}
.MrgL140 {margin-left:140px;}
.Mrg150 {margin:150px;}
.MrgT150 {margin-top:150px;}
.MrgR150 {margin-right:150px;}
.MrgB150 {margin-bottom:150px;}
.MrgL150 {margin-left:150px;}
.Mrg160 {margin:160px;}
.MrgT160 {margin-top:160px;}
.MrgR160 {margin-right:160px;}
.MrgB160 {margin-bottom:160px;}
.MrgL160 {margin-left:160px;}
.Mrg170 {margin:170px;}
.MrgT170 {margin-top:170px;}
.MrgR170 {margin-right:170px;}
.MrgB170 {margin-bottom:170px;}
.MrgL170 {margin-left:170px;}
.Mrg180 {margin:180px;}
.MrgT180 {margin-top:180px;}
.MrgR180 {margin-right:180px;}
.MrgB180 {margin-bottom:180px;}
.MrgL180 {margin-left:180px;}
.Mrg190 {margin:190px;}
.MrgT190 {margin-top:190px;}
.MrgR190 {margin-right:190px;}
.MrgB190 {margin-bottom:190px;}
.MrgL190 {margin-left:190px;}
.Mrg200 {margin:200px;}
.MrgT200 {margin-top:200px;}
.MrgR200 {margin-right:200px;}
.MrgB200 {margin-bottom:200px;}
.MrgL200 {margin-left:200px;}
/* @end */

/* @group インデント */
.Indent1-1em {text-indent: -1em; padding-left: 1em;}
.Indent15-15em {text-indent: -1.5em; padding-left: 1.5em;}
.Indent2-2em {text-indent: -2em; padding-left: 2em;}
.Indent25-25em {text-indent: -2.5em; padding-left: 2.5em;}
.Indent3-3em {text-indent: -3em; padding-left: 3em;}
/* @end */

/*  @group Section Padding：Top + Bottom */
.Section_PddTB-01 {padding-top: 10px; padding-bottom: 10px;}
.Section_PddTB-02 {padding-top: 20px; padding-bottom: 20px;}
.Section_PddTB-03 {padding-top: 30px; padding-bottom: 30px;}
.Section_PddTB-04 {padding-top: 40px; padding-bottom: 40px;}
.Section_PddTB-05 {padding-top: 50px; padding-bottom: 50px;}
.Section_PddTB-06 {padding-top: 60px; padding-bottom: 60px;}
.Section_PddTB-07 {padding-top: 70px; padding-bottom: 70px;}
.Section_PddTB-08 {padding-top: 80px; padding-bottom: 80px;}
.Section_PddTB-09 {padding-top: 90px; padding-bottom: 90px;}
.Section_PddTB-10 {padding-top: 100px; padding-bottom: 100px;}
.Section_PddTB-11 {padding-top: 110px; padding-bottom: 110px;}
.Section_PddTB-12 {padding-top: 120px; padding-bottom: 120px;}
.Section_PddTB-13 {padding-top: 130px; padding-bottom: 130px;}
.Section_PddTB-14 {padding-top: 140px; padding-bottom: 140px;}
.Section_PddTB-15 {padding-top: 150px; padding-bottom: 150px;}
/* @end */

/*  @group Section Margin：Bottom */
.Section_MrgB-01 {margin-bottom: 10px;}
.Section_MrgB-02 {margin-bottom: 20px;}
.Section_MrgB-03 {margin-bottom: 30px;}
.Section_MrgB-04 {margin-bottom: 40px;}
.Section_MrgB-05 {margin-bottom: 50px;}
.Section_MrgB-06 {margin-bottom: 60px;}
.Section_MrgB-07 {margin-bottom: 70px;}
.Section_MrgB-08 {margin-bottom: 80px;}
.Section_MrgB-09 {margin-bottom: 90px;}
.Section_MrgB-10 {margin-bottom: 100px;}
.Section_MrgB-11 {margin-bottom: 110px;}
.Section_MrgB-12 {margin-bottom: 120px;}
.Section_MrgB-13 {margin-bottom: 130px;}
.Section_MrgB-14 {margin-bottom: 140px;}
.Section_MrgB-15 {margin-bottom: 150px;}
/* @end */


/* @group Color */
.Color-Black {color: #000000 !important;}
.Color-White {color: #ffffff !important;}
.Color-Blue {color: #00a9ee !important;}
.Color-Red {color: #d41519 !important;}
.Color-Pink {color: #e3007f !important;}
.Color-Orange {color: #fc593d !important;}
/* @end */

/* @group BackGround Color */
.Bgc-White {background: #ffffff;}
.Bgc-Gray {background: #f5f5f5;}
.Bgc-Gray01 {background-color: #fafafa;}
.Bgc-Blue {background: #00a9ee !important;}
.Bgc-Red {background: #d41519 !important;}
.Bgc-Pink {background: #e3007f !important;}
.Bgc-Orange {background: #fc593d !important;}
/* @end */

/* @group Border */
.Border {border: 1px solid #e6e6e6;}
.BorderT-01 {border-top: 1px solid #e6e6e6;}
.BorderB-01 {border-bottom: 1px solid #e6e6e6;}
/* @end */

/* @group マーカー */
.marker_yellow {
background:linear-gradient(transparent 50%, #fff799 75%);
font-weight:bold; 
}
.marker_lime {
background:linear-gradient(transparent 75%, #bfff7f 75%);
font-weight:bold; 
}
.marker_pink {
background:linear-gradient(transparent 75%, #ffc1e0 75%);
font-weight:bold; 
}
.marker_orange {
background:linear-gradient(transparent 75%, #ffbf7f 75%);
font-weight:bold; 
}
.marker_blue {
background: linear-gradient(transparent 75%, #c1e0ff 75%);
font-weight: bold; 
}
.marker_water {
background:linear-gradient(transparent 75%, #afeeee 75%);
font-weight:bold; 
}
.marker_purple {
background:linear-gradient(transparent 75%, #ce9eff 75%);
font-weight:bold; 
}
/* @end */

/* @group アニメーションマーカー */
.AnimateYellow {
  padding-bottom: .2em;
  background: -webkit-linear-gradient(left, #ffe653 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  background: linear-gradient(to right, #ffe653 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  -webkit-transition: background-position .5s ease-out;
  transition: background-position .5s ease-out;
}
.AnimateYellow:hover {
  background-position: 0% bottom;
  font-weight:bold; 
}
.AnimateLime {
  padding-bottom: .2em;
  background: -webkit-linear-gradient(left, #7fff7f 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  background: linear-gradient(to right, #7fff7f 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  -webkit-transition: background-position .5s ease-out;
  transition: background-position .5s ease-out;
}
.AnimateLime:hover {
  background-position: 0% bottom;
  font-weight:bold; 
}
.AnimatePink {
  padding-bottom: .2em;
  background: -webkit-linear-gradient(left, #ff9ece 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  background: linear-gradient(to right, #ff9ece 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  -webkit-transition: background-position .5s ease-out;
  transition: background-position .5s ease-out;
}
.AnimatePink:hover {
  background-position: 0% bottom;
  font-weight:bold; 
}
.AnimateOrange {
  padding-bottom: .2em;
  background: -webkit-linear-gradient(left, #ffbf7f 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  background: linear-gradient(to right, #ffbf7f 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  -webkit-transition: background-position .5s ease-out;
  transition: background-position .5s ease-out;
}
.AnimateOrange:hover {
  background-position: 0% bottom;
  font-weight:bold; 
}
.AnimateBlue {
  padding-bottom: .2em;
  background: -webkit-linear-gradient(left, #c1e0ff 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  background: linear-gradient(to right, #c1e0ff 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  -webkit-transition: background-position .5s ease-out;
  transition: background-position .5s ease-out;
}
.AnimateBlue:hover {
  background-position: 0% bottom;
  font-weight:bold; 
}
.AnimateWater {
  padding-bottom: .2em;
  background: -webkit-linear-gradient(left, #afeeee 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  background: linear-gradient(to right, #afeeee 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  -webkit-transition: background-position .5s ease-out;
  transition: background-position .5s ease-out;
}
.AnimateWater:hover {
  background-position: 0% bottom;
  font-weight:bold; 
}
.AnimatePurple {
  padding-bottom: .2em;
  background: -webkit-linear-gradient(left, #ce9eff 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  background: linear-gradient(to right, #ce9eff 50%, transparent 50%) 100% bottom / 200% 40% no-repeat;
  -webkit-transition: background-position .5s ease-out;
  transition: background-position .5s ease-out;
}
.AnimatePurple:hover {
  background-position: 0% bottom;
  font-weight:bold; 
}
/* @end */

/*------------------------------------------------------
 全体共通部分
------------------------------------------------------*/
.resp {
	margin-right: auto;
	margin-left: auto;
	width: 96% !important;
}
}
.E-letters {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
}
div.h1Wrapper div.h1 {
    width: 96% !important;
    max-width: 1100px;
    height: 470px;
    margin: auto;
    right: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    color: #fff;
    margin-left: auto;
    margin-right: auto;
}
h3.ttlh3 {
    font-size: 24px;
    font-weight: bold;
    line-height: 40px;
    padding-left: 20px;
    position: relative;
	margin-top: 80px;
	margin-right: 50px;
	margin-left: 50px;
}
h3.ttlh3::before {
    content: "";
    position: absolute;
    margin: auto;
    width: 1px;
    height: 40px;
    top: 0;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(0deg, rgba(0,143,206,1) 0%, rgba(0,153,153,1) 17%, rgba(127,175,38,1) 34%, rgba(232,167,61,1) 50%, rgba(218,85,19,1) 66%, rgba(207,20,120,1) 83%, rgba(91,58,131,1) 100%);
}
div.imgWrapper {
    margin: 120px auto 0 !important;
}
p.p_secondTop {
    margin: 80px auto 120px !important;
}
div.courceWrapper h3 {
    margin-bottom: 40px !important;
}
div.courceWrapper {
    margin: 100px auto 0 !important;
}

div.footer {
    padding-top: 60px !important;
}
div.footerWrapper {
    padding-bottom: 60px !important;
}

p.pankuzu {
    width: 96% !important;
}
h1.bigTitle {
    width: 96% !important;
}
p.cource {
    width: 96% !important;
}
.scroll-hint.is-right-scrollable {
    background-color: none;
}
.scroll-hint.is-left-scrollable {
    background-color: none;
}

dl.sitemap dd > ul:not(ul.sub) > li::before, dl.sitemap2 dd > ul:not(ul.sub) > li::before {
    top: 0.75em !important;
}

div.entryWrapper div.entry {
    font: bold 8em/1vh "Montserrat", sans-serif;
    font-optical-sizing: auto;
    transform: translate(0, -50%) !important;
    text-align: center;
    position: relative;
    margin-top: 45px;
    margin-bottom: 25px;
}


/*------------------------------------------------------
 トップページ
------------------------------------------------------*/
div.mainVisual .Find {
    margin-left: -40px;
	text-align: left;
}
div.mainVisual .Find img {
    width: 450px;
}
div.mainVisual h1 {
	text-align: left;
    margin-left: 0 !important;
}


div.news div.left::before {
    background-image: none !important;
 }

div.news div.left {
    padding: 22px 22px !important;
    margin: 10px 10px;
}
div.ceo img {
    width: 650px;
    height: 350px;
    background: #ccc;
    border-radius: 8px;
    margin-right: 44px;
    object-fit: cover;
}
div.carousel div.carousel-row img {
    object-fit: cover;
}

div.careerWrapper2 a.career img {
    width: 45%;
    object-fit: cover;
}

div.careerWrapper3 a.career3 img {
	width: 140px;
    object-fit: cover;
}


p.viewmore2 {
    right: 25px !important;
    bottom: 20px !important;
    font-family: "Montserrat";
    font-weight: 500 !important;
	letter-spacing: 0.04rem;
}
p.viewmore8 {
	font: 1.3em/1em "Montserrat" !important;
	font-weight: 500 !important;
	margin-top: 35px !important;
	letter-spacing: 0.04rem;
	padding-bottom: .5em;
}
p.viewmore8 span.t2 {
	margin-top: 0.5em;
	padding-top: 1px;
}

h2.second {
    width: 96% !important;
	margin: 200px auto 0 !important;
}
div.h2Inner {
    width: 92% !important;
}

div.history h3 {
    font-size: 2em;
    font-weight: bold;
}
div.envWorkWrapper div.envwork a {
	padding-bottom: 1em;
}
div.envWorkWrapper div.envwork p.envwork {
	margin-top: 35px !important;
}
div.DigitalPamphlet {
	margin-right: auto;
	margin-left: auto;
	max-width: 540px;
	margin-top: 1em;
}

/*------------------------------------------------------
 　グローバルメニュー
------------------------------------------------------*/

div.sitemap {
    padding-top: 0 !important;
    padding-bottom: 30px !important;
}
.megaMenu h3 {
    font-weight: bold;
}
.megaMenu li {
    font-weight: bold;
}
div.megaMenu {
    background: rgba(255,255,255,1) !important;
}


/*------------------------------------------------------
 フッターマップ
------------------------------------------------------*/
div.entryWrapper h5.entry {
	font: bold 8em/1vh "Montserrat", sans-serif;
	font-optical-sizing: auto;
	transform: translate(0, -50%) !important;
	text-align: center;
	position: relative;
	margin-top: 45px;
    margin-bottom: 25px;
}

.sitemapWrapper h2 {
	margin-top: 45px;
    margin-bottom: 25px !important;
}

ul.line li {
    margin-bottom: 15px !important;
}
ul.line {
    margin-bottom: 30px !important;
}

div.sitemapWrapper h3.non {
	padding-left: 0 !important;
	background-image: none !important;
	background: none !important;
}
.megaMenu h3.red, ul.red li {
    padding-bottom: 10px !important;
    margin-bottom: 25px !important;
}


/*------------------------------------------------------
 トップメッセージ
------------------------------------------------------*/
div.movie div.right div.youtube {
    background: none !important;
}
div.movie div.right div.youtube iframe {
    border-radius: 20px;
}


/*------------------------------------------------------
 マツキヨココカラ&カンパニーについて
------------------------------------------------------*/

div.aboutmcc {
    width: 94% !important;
	max-width: 800px;
	line-height: 2.4em !important;
}
div.separate div.right div.company {
    margin-top: 60px !important;
    gap: 5% !important;
}
div.separate div.right div.company p {
    width: 60% !important;
}
div.separate div.company img {
    width: 35% !important;
	height: 170px !important;
}
h2.second.grouplist {
    margin: 70px 20px 0;
}
div.generalWrapper div.group_new {
    box-sizing: border-box;
    padding: 37px;
    border: 1px solid #ECF1F1;
    border-radius: 10px;
    display: flex;
    gap: 24px;
    /* width: 540px; */
    width: calc(50% - 10px);
    max-width: 540px;
}
div.group_new img {
    width: 102px !important;
    height: 59px !important;
    object-fit: cover;
    object-position: center;
    border-radius: 3.9px;
}
div.generalWrapper div.group_new h4 {
    font-weight: bold;
    font-size: 18px;
}
div.group_new dl {
    display: flex;
    gap: 9px;
    align-items: baseline;
    margin-top: 18px;
}
div.group_new dl dt {
    color: #A0AFB7;
    font-size: 12px;
    width: 50px;
}
div.group_new dl dd {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: baseline;
}
div.group_new dl dd span {
    font-size: 12px;
    color: #fff;
    padding: 5px 10px;
    line-height: 1em;
    background-color: #A0AFB7;
    border-radius: 20px;
}
.about-img {
	padding: 4%;
	margin: 1.6em auto 0;
	text-align: center;
}

/*------------------------------------------------------
 数字で見る
------------------------------------------------------*/
div.numcontents.number img.w300{
	width:300px;
}

div.numcontents.description dl.general dd {
	line-height: 2em;
}
div.column2 {
    justify-content: center;
}
div.column3 {
    justify-content: center;
}
.NumberMrgT40 {margin-top:40px;}

/*------------------------------------------------------
 部門紹介
------------------------------------------------------*/
div.h2Inner iframe {
    position: absolute;
    width: 600px;
    height: 300px;
    object-fit: cover;
    object-position: center;
    right: 0;
    z-index: 2;
    bottom: -137px;
    border-radius: 28px;
}
ul.employee li div {
    line-height: 1.8;
}
a.toEmployee {
    margin: 0 auto 3em !important;
}

/*------------------------------------------------------
 社員インタビュー
------------------------------------------------------*/
div.interviewListWrapper, div.storeListWrapper {
    justify-content: center;
}
div.interviewList p.comment {
    font-size: 18px !important;
    font-weight: bold;
    bottom: 15px !important;
}

div.interviewIndex p.comment span.cmt {
	font-size: 18px !important;
	padding: 2px 4px !important;
}
p.comment span.cmt {
    font-size: 18px !important;
}

div.interviewList img {
    object-fit: cover;
}

div.interviewSlide div img{
    object-fit: cover;
}

div.interview2 p.content img {
	width: 400px;
}
h2.other {
	font-weight: 900;
	letter-spacing: 0.2rem;
}
p.comment::before {
	font-weight: 900;
	letter-spacing: 0.12rem;	
}

div.interview2 p.content {
	line-height: 2.8em !important;
}
div.mydayoff p.content {
	line-height: 2.8em !important;
}
div.interviewNarrow p.content {
	line-height: 2.8em !important;
}

div.interview2 h2.summary {
	line-height: 1.6em;
}

div.interviewSlide div img {
    height: 230px !important;
}

div.interviewSlide div {
    width: 290px !important;
    height: 230px !important;
}

div.interviewSlide p.comment {
    left: 15px !important;
}

button.slick-arrow {
    top: 100px !important;
}


/*------------------------------------------------------
 会社紹介
------------------------------------------------------*/
div.companyLeft h2 {
    padding: 30px;
    font-size: 18px;
    font-weight: bold;
    background-image: linear-gradient(90deg, rgba(0,139,202,0.07) 0%, rgba(0,149,149,0.07) 17%, rgba(127,171,38,0.07) 34%, rgba(228,163,61,0.07) 50%, rgba(214,85,19,0.07) 66%, rgba(203,20,120,0.07) 83%, rgba(91,51,128,0.07) 100%);
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
div.companyLeft dl dd {
	margin-bottom: .8em;
}

/*------------------------------------------------------
 歩みと歴史
------------------------------------------------------*/
dl.history {
    margin: 60px auto 0px !important;
}
div.history div.progress h4 {
	font-weight: 500;
	font-size: 1.7em;
	margin-top: 1.2em;
}
div.history {
    width: 96% !important;
	margin: 0 auto !important;
}
div.history div.date p.month {
    width: 38% !important;
}
div.history div.progress p.supple {
	line-height: 2em;
}
div.history div.date {
    width: 24% !important;
}
div.history div.progress div.img img, div.historyImgWrapper img {
	height: auto !important;
}
div.history div.date {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
}
div.history div.date p.year {
    width: auto !important;
}
div.history div.date p.month {
	margin-top: .4em;
}
div.history div.progress {
    width: 74% !important;
}
div.history div.progress div.content {
    width: 65% !important;
}
div.history div.progress div.img {
    width: 33% !important;
}
div.history div.progress div.img img, div.historyImgWrapper img {
    width: 100% !important;
}
/*------------------------------------------------------
 店舗紹介
------------------------------------------------------*/
div.storeDetail {
    width: 96% !important;
}

div.storeDetail div.left540{
    width:54%;
}
div.storeDetail div.left560{
    width:55%;
}
div.storeDetail div.right630{
    width:60%;
}
div.storeDetail div.right500{
    width:50%;
}

div.storeDetailImg260{
    flex-wrap: wrap;
    display: flex;
    justify-content: space-between;
    gap:2%;
}
div.storeDetailImg260 img{
    border-radius: 10px;
    object-fit: cover;
    object-position: center;
    width:49%;
	height:260px;
}

div.storeDetailImg540{
    flex-wrap: wrap;
    display: flex;
    justify-content: space-between;
    gap:2%;
}
div.storeDetailImg540 img{
    border-radius: 10px;
    object-fit: cover;
    object-position: center;
}
div.storeDetailImg540 img:nth-child(1){
    width:100%;
	height:260px;
}
div.storeDetailImg540 img:nth-child(2),
div.storeDetailImg540 img:nth-child(3){
    width:49%;
	height:240px;
	margin-top: 2%;
}

div.storeDetailImg630{
    flex-wrap: wrap;
    display: flex;
    justify-content: space-between;
    gap:2%;
}
div.storeDetailImg630 img{
    border-radius: 10px;
    object-fit: cover;
    object-position: center;
}
div.storeDetailImg630 img:nth-child(1){
    width:100%;
	height:360px;
}
div.storeDetailImg630 img:nth-child(2),
div.storeDetailImg630 img:nth-child(3){
    width:49%;
	height:180px;
	margin-top: 2%;
}

div.storeDetailImg630-3{
    flex-wrap: wrap;
    display: flex;
    justify-content: space-between;
    gap:2%;
}
div.storeDetailImg630-3 img{
    border-radius: 10px;
    object-fit: cover;
    object-position: center;
}
div.storeDetailImg630-3 img:nth-child(1){
    width:100%;
	height:360px;
}
div.storeDetailImg630-3 img:nth-child(2),
div.storeDetailImg630-3 img:nth-child(3),
div.storeDetailImg630-3 img:nth-child(4){
    width: 32%;
	height:200px;
	margin-top: 2%;
}


div.storeDetailImg {
    gap: 1% !important;
}
div.storeDetailImg img:nth-child(1) {
    width: 40% !important;
}
div.storeDetailImg img:nth-child(2), div.storeDetailImg img:nth-child(3), div.storeDetailImg img:nth-child(4) {
    width: 19% !important;
}

div.storeDetailImg {
    gap: 1% !important;
    width: 100%;
}


/*-----------------------------------------------
　部門紹介　組織イラスト
-------------------------------------------------*/
div.generalWrapper.jobcategory {
    max-width: 1400px !important;
    width: 100% !important;
    overflow: hidden;
}

div.divisionWrapper {
    gap: 2% !important;
}
div.division {
    width: calc(33% - 1%) !important;
}
div.division p {
    margin: 0 5% 18px !important;
}

/* @group クリックアニメーション */
.JobContainer {
  position: relative;
  width: 24px;
  height: 24px;
  margin-top: -10em;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
  padding-bottom: 14em;
}

.JobChevron {
  position: absolute;
  width: 28px;
  height: 8px;
  opacity: 0;
  transform: scale3d(0.5, 0.5, 0.5);
  animation: move 3s ease-out infinite;
}

.JobChevron:first-child {
  animation: move 3s ease-out 1s infinite;
}

.JobChevron:nth-child(2) {
  animation: move 3s ease-out 2s infinite;
}

.JobChevron:before,
.JobChevron:after {
  content: ' ';
  position: absolute;
  top: 0;
  height: 100%;
  width: 51%;
  background: #000;
}

.JobChevron:before {
  left: 0;
  transform: skew(0deg, 30deg);
}

.JobChevron:after {
  right: 0;
  width: 50%;
  transform: skew(0deg, -30deg);
}

@keyframes move {
  25% {
    opacity: 1;

  }
  33% {
    opacity: 1;
    transform: translateY(30px);
  }
  67% {
    opacity: 1;
    transform: translateY(40px);
  }
  100% {
    opacity: 0;
    transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
  }
}

.JobText {
  display: block;
  margin-left: -200%;
  font: 1.2em "Montserrat", sans-serif;
  font-weight: 800;
  color: #000;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: .25;
  animation: pulse 2s linear alternate infinite;
  padding-top: 70px;
}

@keyframes pulse {
  to {
    opacity: 1;
  }
}


/* @end */

/* @group 組織イラスト動作 */
.Career-Illust {
    display: flex;
    justify-content: center;
    padding-top: 50px;
}

.Career-Illust .Illust-Town {
    position: relative;
    width: 100%;
    min-width: 1380px;
    max-width: 1380px;
    height: 940px;
    background-image: url("../img/portal/career-illust-town.svg");
    background-size: 1380px 940px;
    background-repeat: no-repeat;
    background-position: center center;
}

.Career-Illust .Illust-Town .Illust-MKCFCO {
    position: absolute;
    left: 0;
    right: 0;
    top: -60px;
    margin: auto;
    width: 100%;
    max-width: 260px;
    height: auto;
    transition: all 0.3s;
	z-index: 1;
}

.Career-Illust .Illust-Town .Illust-MKCFCO:hover {
    top: -70px;
    transition: all 0.3s;
}

.Career-Illust .Illust-Town .Illust-MEGCFG {
    position: absolute;
    left: 10px;
    top: 60px;
    width: 100%;
    max-width: 1356px;
    height: auto;
    transition: all 0.3s;
}

.Career-Illust .Illust-Town .Illust-MEGCFG:hover {
    top: 50px;
    transition: all 0.3s;
}

.Career-Illust .Illust-Town .Illust-MKG {
    position: absolute;
    left: 10px;
    top: -10px;
    width: 100%;
    max-width: 592px;
    height: auto;
    transition: all 0.3s;
}

.Career-Illust .Illust-Town .Illust-MKG:hover {
    top: -20px;
    transition: all 0.3s;
}

.Career-Illust .Illust-Town .Illust-CFG {
    position: absolute;
    right: 10px;
    top: -10px;
    width: 100%;
    max-width: 592px;
    height: auto;
    transition: all 0.3s;
}

.Career-Illust .Illust-Town .Illust-CFG:hover {
    top: -20px;
    transition: all 0.3s;
}

.Career-Illust .Illust-Town .Illust-MCCM {
    position: absolute;
    left: 0;
    right: 0;
    top: 360px;
    margin: auto;
    width: 100%;
    max-width: 245px;
    height: auto;
    transition: all 0.3s;
	z-index: 1;
}

.Career-Illust .Illust-Town .Illust-MCCM:hover {
    top: 350px;
    transition: all 0.3s;
}

.Career-Illust .Illust-Town .Illust-MKCFCO a img,
.Career-Illust .Illust-Town .Illust-MKGCFG a img,
.Career-Illust .Illust-Town .Illust-MKG a img,
.Career-Illust .Illust-Town .Illust-CFG a img,
.Career-Illust .Illust-Town .Illust-MCCM a img {
    width: 100%;
    height: auto;
}

/**/

.Career-Illust .Illust-Town .Illust-MKCFCO02 {
    position: absolute;
    left: 0;
    right: 0;
    top: 180px;
    margin: auto;
    width: 100%;
    max-width: 150px;
    height: auto;
    transition: all 0.3s;
	z-index: 1;
}

.Career-Illust .Illust-Town .Illust-MCCM02 {
    position: absolute;
    left: 0;
    right: 0;
    top: 560px;
    margin: auto;
    width: 100%;
    max-width: 42px;
    height: auto;
	z-index: 1;
}

.Career-Illust .Illust-Town .Illust-MKCFCO02 img,
.Career-Illust .Illust-Town .Illust-MCCM02 img {
    width: 100%;
    height: auto;
}
/* @end */



/*------------------------------------------------------
 モーダル
------------------------------------------------------*/

.modal-wrapper {
  z-index: 999;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 60px 10px;
  text-align: center
}

.modal-wrapper:not(:target) {
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s;
}

.modal-wrapper:target {
  opacity: 1;
  visibility: visible;
  transition: opacity .4s, visibility .4s;
}

.modal-wrapper::after {
  display: inline-block;
  height: 100%;
  margin-left: -.05em;
  vertical-align: middle;
  content: ""
}

.modal-overlay {
  z-index: 10;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, .7)
}

.modal-wrapper .modal-close {
  z-index: 20;
  position: absolute;
  top: -10px;
  right: -10px;
  width: 40px;
    height: 40px;
  color: #ffffff !important;
    background-color: #000000;
    border-radius: 20px;
  font-size: 20px;
  font-weight: 700;
  line-height: 40px;
  text-align: center;
  text-decoration: none;
  text-indent: 0
}

.modal-wrapper .modal-close:hover {
  background-color: #666666;
}

.modal-wrapper .modal-window {
  box-sizing: border-box;
  display: inline-block;
  z-index: 20;
  position: relative;
  width: 90%;
  border-radius: 30px;
  background: #fff;
  box-shadow: 0 0 30px rgba(0, 0, 0, .6);
  vertical-align: middle
}

.modal-wrapper .modal-window .modal-content {
  max-height: 80vh;
  overflow-y: auto;
  margin-bottom: 40px;
	margin-top: 60px;
}

.Modal-Inner {
    width: 90%;
    padding: 50px 4%;
    text-align: left;
	margin-right: auto;
	margin-left: auto;
}
.Modal-Inner h3 {
	font-weight: bold;
    line-height: 1em;
    padding-left: 1em;
    position: relative;
	margin-top: 2.4em;
	margin-bottom: 2em;
	font-size: 2.4em;
}
.Modal-Inner h3::before {
    content: "";
    position: absolute;
    margin: auto;
    width: 1px;
    height: 40px;
    top: 0;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(0deg, rgba(0,143,206,1) 0%, rgba(0,153,153,1) 17%, rgba(127,175,38,1) 34%, rgba(232,167,61,1) 50%, rgba(218,85,19,1) 66%, rgba(207,20,120,1) 83%, rgba(91,58,131,1) 100%);
}


.flexbox2 .card p {
line-height: 2em;
font-size: 1.6em;
flex-grow: 1;
margin-bottom: 1.5em;
}

/* ❶ */
.flexbox2 .card {
  display: flex;
  flex-wrap: wrap;
}
 
.flexbox2 .card .item {
  width: 45%;
}
 
.flexbox2 .card .item:not(:nth-child(2n)) {
  margin-right: 10%;
}
 
.flexbox2 .card .item:nth-child(n+3) {
  margin-top: 30px;
}
 
/* ❷ */
.flexbox2 .card .item div.adjust {
  display: flex;
  flex-direction: column; /* ★ポイント★ */
  height: 100%;
}
 
.flexbox2 .card .btn {
  margin-top: auto; /* ★ポイント★ */
  padding-top: 12px;
}

.flexbox2 a {
    text-align: center;
    display: block;
    width: 200px;
    line-height: 36px;
    color: #fff;
    background-color: #000;
    background-image: url("../images/arrow_interview.svg");
    background-position: right 10px center;
    background-repeat: no-repeat;
    background-size: 10px;
    border-radius: 18px;
    margin: auto auto 0;
    font-size: 14px;
	text-indent: -1em;
}



/*------------------------------------------------------
 社員インタビュー
------------------------------------------------------*/
div.welfareWrapper {
    gap: 2% !important;
}
div.welfare {
    width: 31% !important;
    margin-bottom: 2em;
}
div.welfare img {
    width: 100% !important;
	height: auto !important;
}
div.welfare dd {
    font-size: 1.6em !important;
    line-height: 2em !important;
	margin: 0 8% !important;
}


/*------------------------------------------------------
 限定勤務地制度
------------------------------------------------------*/
#work-location img {
	max-width: 1000px;
	width: 90%;
	margin: 40px auto 30px;
	padding-left: 5em;
}
table.workarea, table.workarea2 {
    margin: 40px auto 30px !important;
}


/*------------------------------------------------------
 研修制度
------------------------------------------------------*/
.training-program-speh3 {
	font-size: 3em;
	text-align: center !important;
	margin: 1.5em auto 1em;
	font-weight: bold;
	width: 100%;
}

/*------------------------------------------------------
 経験者採用情報
------------------------------------------------------*/
div.generalWrapper p.generalNormal {
	width: 96%;
	margin-left: auto;
	margin-right: auto;
}
p.referral1, p.referral2 {
    width: 96% !important;
}

dl.process + p, dl.process2 + p {
    margin: auto auto 30px !important;
}


/*------------------------------------------------------
 アルムナイ採用
------------------------------------------------------*/
div.alumni {
    padding: 60px 85px !important;
}
a.AlumniEntry {
	font-size: 1.6em;
	margin-top: 2em !important;
    display: block;
    width: 560px;
    height: 75px;
    line-height: 75px;
    text-align: center;
    background-color: #000;
    color: #fff;
    border-radius: 75px;
    background-image: url("../images/arrow_interview.svg");
    background-repeat: no-repeat;
    background-position: right 36px center;
    background-size: 10px;
    /* position: absolute; */
    margin: auto;
    left: 0;
    right: 0;
    bottom: -37.5px;
}
/*------------------------------------------------------
 よくある質問
------------------------------------------------------*/
dl.faq {
    max-width: 960px !important;
    padding: 30px 90px 30px 30px !important;
}
dl.faq dt::before {
margin-top: -0.25em;
}

ul.menu-icon {
    right: -50px !important;
}

/*------------------------------------------------------
 中途研修
------------------------------------------------------*/

table.career_training{
  border-collapse: collapse;
  width: 100%;
  font-size: 1.4em;
  margin-top: 1em;
	margin-bottom: 6em;
}
table.career_training th,
table.career_training td{
  padding: 15px;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
}
table.career_training th {
  background: #DF542F;
  color: #fff;
  font-weight: bold;
  text-align: center;
  font-size: 1.2em;
}
table.career_training th span {
	font-size: .9em;
	font-weight: normal;
	font-style: normal;
}
@media screen and (max-width: 640px) {
  table.career_training {
    width: 100%;
  }
  table.career_training th,
  table.career_training td {
    display: block;
    width: 100%;
    border-bottom:none;
  }
  table.career_training tr:last-child{
    border-bottom: solid 1px #ccc;
  }
}

ul.alumni {
	color: black !important;
}

/*採用比率テーブル*/

.Ratio-Table {
    width: 100%;
    border-top: 1px solid #e6e6e6;
    border-right: 1px solid #e6e6e6;
    margin-top: 80px;
	font-size: 16px;
}

.Ratio-Table th,
.Ratio-Table td {
    border-bottom: 1px solid #e6e6e6;
    border-left: 1px solid #e6e6e6;
}

.Ratio-Table th.Ratio-Bg,
.Ratio-Table td.Ratio-Bg {
    background-color: #fafafa;
}

.Ratio-Table th {
    text-align: center;
    padding: 20px;
    font-size: 1.0em;
    font-weight: 700;
}

.Ratio-Table .thead th span.Ratio-Bgy {
    display: inline-block;
    background-image: linear-gradient(90deg, rgba(0, 139, 202, 0.07) 0%, rgba(0, 149, 149, 0.07) 17%, rgba(127, 171, 38, 0.07) 34%, rgba(228, 163, 61, 0.07) 50%, rgba(214, 85, 19, 0.07) 66%, rgba(203, 20, 120, 0.07) 83%, rgba(91, 51, 128, 0.07) 100%);
    padding: 5px 8px;
}

.Ratio-Table td {
    font-size: 1.2em;
    font-weight: 700;
    padding: 25px 20px;
    vertical-align: middle;
}

.Ratio-Table td span.Number-Large {
    font-size: 1.8em;
    font-weight: 900;
    padding-right: 2px;
}

.Ratio-Table td:first-child {
    font-size: 0.8em;
    font-weight: 500;
    color: #999999;
}

.Ratio-Table td:first-child .Company-Logo {
    width: 100%;
    max-width: 250px;
    margin-bottom: 8px;
}

.Ratio-Table td:first-child .Company-Logo img {
    width: 100%;
    height: auto;
}

.Ratio-Table td:not(:first-child) {
    text-align: center;
}


/*------------------------------------------------------
 募集要項
------------------------------------------------------*/
.rmap {
    margin-top: -130px !important;
}
.rmap dl dd {
    width: max(21vw,320px) !important;
    padding: 1.6vw 0.5vw 1.4vw 2.5vw !important;
}
div.entry450 {
	width: 450px;
	margin: 60px auto 160px;
}

div.recruitMap {
    margin-top: -200px;
}
ul.popup {
    font-size: 14px !important;
    line-height: 2em;
}


/*------------------------------------------------------
 FAQ
------------------------------------------------------*/
.animateLink a {
  color: inherit;
  text-decoration: none;
}

.animateLink a {
  background:
    linear-gradient(
      to right,
      rgba(0, 0, 0, 1),
      rgba(0, 0, 0, 1)
    ),
    linear-gradient(
      to right,
      rgba(0,143,206,1) 0%, rgba(0,153,153,1) 17%, rgba(127,175,38,1) 34%, rgba(232,167,61,1) 50%, rgba(218,85,19,1) 66%, rgba(207,20,120,1) 83%, rgba(91,58,131,1) 100%
  );
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 400ms;
}

.animateLink a:hover {
  background-size: 0 2px, 100% 2px;
}



/* @group スクロールアニメーション + js */

/* fade zoom */
.u-fade-type-zoom.is-active{
    transition: 8s;
    transform: scale(1.06);
}

/* fade up */
.u-fade-type-up{
    transform: translateY(50px);
    opacity: 0;
}

.u-fade-type-up.is-active{
    transition: .6s;
    transform: translateY(0);
    opacity: 1;
}

.is-active .u-fade-type-up{
    transition: .6s;
    transform: translateY(0);
    opacity: 1;
}

.is-active .u-fade-type-up:nth-child(2){transition-delay: 0.2s;}
.is-active .u-fade-type-up:nth-child(3){transition-delay: 0.4s;}
.is-active .u-fade-type-up:nth-child(4){transition-delay: 0.8s;}
.is-active .u-fade-type-up:nth-child(5){transition-delay: 1.0s;}
.is-active .u-fade-type-up:nth-child(6){transition-delay: 1.2s;}
.is-active .u-fade-type-up:nth-child(7){transition-delay: 1.4s;}
.is-active .u-fade-type-up:nth-child(8){transition-delay: 1.6s;}
.is-active .u-fade-type-up:nth-child(9){transition-delay: 1.8s;}
.is-active .u-fade-type-up:nth-child(10){transition-delay: 2.0s;}
.is-active .u-fade-type-up:nth-child(11){transition-delay: 2.2s;}
.is-active .u-fade-type-up:nth-child(12){transition-delay: 2.4s;}
.is-active .u-fade-type-up:nth-child(13){transition-delay: 2.6s;}
.is-active .u-fade-type-up:nth-child(14){transition-delay: 2.8s;}
.is-active .u-fade-type-up:nth-child(15){transition-delay: 3.0s;}
.is-active .u-fade-type-up:nth-child(16){transition-delay: 3.2s;}
.is-active .u-fade-type-up:nth-child(17){transition-delay: 3.4s;}
.is-active .u-fade-type-up:nth-child(18){transition-delay: 3.6s;}
.is-active .u-fade-type-up:nth-child(19){transition-delay: 3.8s;}
.is-active .u-fade-type-up:nth-child(20){transition-delay: 4.0s;}
.is-active .u-fade-type-up:nth-child(21){transition-delay: 4.2s;}
.is-active .u-fade-type-up:nth-child(22){transition-delay: 4.4s;}
.is-active .u-fade-type-up:nth-child(23){transition-delay: 4.6s;}
.is-active .u-fade-type-up:nth-child(24){transition-delay: 4.8s;}
.is-active .u-fade-type-up:nth-child(25){transition-delay: 5.0s;}


/* fade left */
.u-fade-type-left{
    transform: translateX(50px);
    opacity: 0;
}

.u-fade-type-left.is-active{
    transition: .6s;
    transform: translateX(0);
    opacity: 1;
}

.is-active .u-fade-type-left{
    transition: .6s;
    transform: translateX(0);
    opacity: 1;
}

.is-active .u-fade-type-left:nth-child(2) {transition-delay: 0.2s;}
.is-active .u-fade-type-left:nth-child(3) {transition-delay: 0.4s;}
.is-active .u-fade-type-left:nth-child(4) {transition-delay: 0.6s;}
.is-active .u-fade-type-left:nth-child(5) {transition-delay: 0.8s;}
.is-active .u-fade-type-left:nth-child(6) {transition-delay: 1.0s;}
.is-active .u-fade-type-left:nth-child(7) {transition-delay: 1.2s;}
.is-active .u-fade-type-left:nth-child(8) {transition-delay: 1.4s;}
.is-active .u-fade-type-left:nth-child(9) {transition-delay: 1.6s;}
.is-active .u-fade-type-left:nth-child(10) {transition-delay: 1.8s;}
.is-active .u-fade-type-left:nth-child(11) {transition-delay: 2.0s;}
.is-active .u-fade-type-left:nth-child(12) {transition-delay: 2.2s;}
.is-active .u-fade-type-left:nth-child(13) {transition-delay: 2.4s;}
.is-active .u-fade-type-left:nth-child(14) {transition-delay: 2.6s;}
.is-active .u-fade-type-left:nth-child(15) {transition-delay: 2.8s;}
.is-active .u-fade-type-left:nth-child(16) {transition-delay: 3.0s;}
.is-active .u-fade-type-left:nth-child(17) {transition-delay: 3.2s;}
.is-active .u-fade-type-left:nth-child(18) {transition-delay: 3.4s;}
.is-active .u-fade-type-left:nth-child(19) {transition-delay: 3.6s;}
.is-active .u-fade-type-left:nth-child(20) {transition-delay: 3.8s;}
.is-active .u-fade-type-left:nth-child(21) {transition-delay: 4.0s;}
.is-active .u-fade-type-left:nth-child(22) {transition-delay: 4.2s;}
.is-active .u-fade-type-left:nth-child(23) {transition-delay: 4.4s;}
.is-active .u-fade-type-left:nth-child(24) {transition-delay: 4.6s;}
.is-active .u-fade-type-left:nth-child(25) {transition-delay: 4.8s;}

/* img */
.u-fade-type-slide{
    position: relative;
}

.u-fade-type-slide::after{
    content: '';
    display: block;
    width: 100%;
    transform: scaleX(1);
    transform-origin: 100% 0;
    height: 100%;
    background-color: #eee;
    position: absolute;
    top: 0;
    right: 0;
}

.u-fade-type-slide.is-active::after{
    transition: .6s;
    transform: scaleX(0);
}

/* single marker */
.u-fade-type-marker {
    background: linear-gradient(to right, transparent 50%,  rgba(255, 165, 0, 0.3) 50%);
    background: linear-gradient(to right, transparent 50%, rgba(255, 165, 0, 0.3) 50%);
    background-repeat: repeat-x;
    background-size: 200% .6em;
    background-position: 0 .6em;
    padding-bottom: .6em;
}

.u-fade-type-marker.is-active{
    transition: all 1.2s ease;
    background-position: -100% .6em;
}


.Fadeup.is-animated {
  animation: fadeup 1s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}
 
@keyframes Fadeup {
  0% {
    transform: translateY(30px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.Zoomin {
  animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
 
@keyframes ZoomIn {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.Slidein {
  animation: slideIn 1s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
 
@keyframes SlideIn {
  0% {
    transform: translateX(180px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}

.Poyoyon {
  animation: poyoyon 0.5s cubic-bezier(0.12, 0, 0.39, 0) 1 forwards;
}
 
@keyframes Poyoyon {
  0% {
    transform: translateX(140px);
    opacity: 0;
  }
  50% {
    transform: translateX(0);
  }
  65% {
    transform: translateX(30px);
  }
  100% {
    transform: translateX(0);
  }
  20%,100% {
    opacity: 1;
  }
}

.Popup {
  animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
 
@keyframes popup {
  0% {
    transform: translateY(40px) scale(0.8);
    opacity: 0;
  }
  100% {
    transform: translateY(0) scale(1.0);
  }
  80%, 100% {
    opacity: 1;
  }
}
/* @end */


.details {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	list-style: none;
	max-width: 1100px;
	margin: 1em auto;
	padding: 0;
	text-align: center;
}

.details li {
	flex-basis: calc(50% - 8px);
	position: relative;
	border-radius: 8px;
    background-color: #fff;
    border-radius: 20px;
    background-image: url("../images/num_corner.svg");
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 40px 10px;
    background-size: 30px;
	width: 30%;
}
@media (max-width: 720px) {
	.details li {
		flex-basis: calc(50% - 6px);
	}
	.details li:nth-child(n+3) {
		margin-top: 12px;
	}
}
@media (max-width: 520px) {
	.details {
		flex-direction: column;
		align-items: center;
	}
	.details li {
		flex-basis: auto;
	}
	.details li:nth-child(n+2) {
		margin-top: 12px;
	}
}

.details .image {
	margin: 0;
}
.details .image img {
	max-width: 330px;
	height: auto;
	border-radius: 8px;
	vertical-align: middle;
	width: 360px;
}
.details li{
	font-size: 1.6em;
	line-height: 2em;
	width: 33%;
}
.details h3 {
	font-size: 1.5em;
    font-weight: bold;
    padding: 5px 8px;
    background-image: linear-gradient(90deg, rgba(0, 139, 202, 0.07) 0%, rgba(0, 149, 149, 0.07) 17%, rgba(127, 171, 38, 0.07) 34%, rgba(228, 163, 61, 0.07) 50%, rgba(214, 85, 19, 0.07) 66%, rgba(203, 20, 120, 0.07) 83%, rgba(91, 51, 128, 0.07) 100%);
	margin-top: 1em;
	margin-bottom: .5em;
}


.details p.number {
	font: 4em "Montserrat", sans-serif;
	font-weight: bold;
	font-optical-sizing: auto;
}
.details p.number .small {
	font-size: 50%;
	padding-left: .3em;
}



.details .text {
	display: grid;
	grid-template-rows: 1fr auto 1fr;
	position: absolute;
	inset: 0;
	margin: 0;
	padding: 16px 24px;
	border-radius: 8px;
	text-align: left;
	background: rgba(225,255,255,.9);
}
.details .text dt {
	justify-self: flex-start;
	align-self: flex-end;
}
.details .text dd {
	margin: .5em 0 0;
	font-size: .8em;
	line-break: strict;
	overflow-wrap: break-word;
}
.details .text .price {
	justify-self: flex-end;
}

/* :::::: type1 :::::: */
.type1 {
	overflow: hidden;
}
.type1 .text {
	transition: opacity .6s, transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.type1:not(:hover) .text {
	opacity: 0;
	transform: translateY(100%);
}
