@charset "UTF-8";

/* ====================================
	UTILITY
===================================== */

.mt-10	{ margin-top:-10px !important; }
.mt-5	{ margin-top:-5px !important; }
.mt0	{ margin-top:0px !important; }
.mt5	{ margin-top:5px !important; }
.mt10	{ margin-top:10px !important; }
.mt15	{ margin-top:15px !important; }
.mt20	{ margin-top:20px !important; }
.mt25	{ margin-top:25px !important; }
.mt30	{ margin-top:30px !important; }
.mt40	{ margin-top:40px !important; }
.mt50	{ margin-top:50px !important; }
.mt60	{ margin-top:60px !important; }
.mt100	{ margin-top:100px !important; }

.mr0	{ margin-right:0px !important; }
.mr5	{ margin-right:5px !important; }
.mr10	{ margin-right:10px !important; }
.mr15	{ margin-right:15px !important; }
.mr20	{ margin-right:20px !important; }
.mr25	{ margin-right:25px !important; }
.mr30	{ margin-right:30px !important; }
.mr40	{ margin-right:40px !important; }
.mr50	{ margin-right:50px !important; }
.mr100	{ margin-right:100px !important; }

.mb0	{ margin-bottom:0px !important; }
.mb3	{ margin-bottom:3px !important; }
.mb5	{ margin-bottom:5px !important; }
.mb10	{ margin-bottom:10px !important; }
.mb15	{ margin-bottom:15px !important; }
.mb20	{ margin-bottom:20px !important; }
.mb25	{ margin-bottom:25px !important; }
.mb30	{ margin-bottom:30px !important; }
.mb40	{ margin-bottom:40px !important; }
.mb50	{ margin-bottom:50px !important; }
.mb100	{ margin-bottom:100px !important; }

.ml0	{ margin-left:0px !important; }
.ml2	{ margin-left:2px !important; }
.ml5	{ margin-left:5px !important; }
.ml10	{ margin-left:10px !important; }
.ml15	{ margin-left:15px !important; }
.ml20	{ margin-left:20px !important; }
.ml25	{ margin-left:25px !important; }
.ml30	{ margin-left:30px !important; }
.ml40	{ margin-left:40px !important; }
.ml50	{ margin-left:50px !important; }
.ml100	{ margin-left:100px !important; }


/* ====================================
	FONT
===================================== */

/* defalt font-size */
.f9 { font-size: 62.5% !important; }
.f10 { font-size:77% !important; }
.f11 { font-size:85% !important; }
.f12 { font-size:93% !important; }
.f13 { font-size:100% !important; }
.f14 { font-size:108% !important; }
.f15 { font-size:116% !important; }
.f16 { font-size:123.1% !important; }
.f17 { font-size:131% !important; }
.f18 { font-size:138.5% !important; }
.f19 { font-size:146.5% !important; }
.f20 { font-size:153.9% !important; }
.f21 { font-size:161.6% !important; }
.f22 { font-size:167% !important; }
.f23 { font-size:174% !important; }
.f24 { font-size:182% !important; }
.f25 { font-size:189% !important; }
.f26 { font-size:197% !important; }

.B	{ font-weight:bold !important; }
.pink	{ color:#f74ff7 !important; }
.blue	{ color:#0079fa !important; }
.gray	{ color:#aaa !important; }
.red	{ color:#e6002d !important; }
.black	{ color:#000000 !important; }
.white	{ color:#ffffff !important; }

.pc { display: block !important; }
.sp { display: none !important; }
@media only screen and (max-width: 767px) {
.pc { display: none !important; }
.sp { display: block !important; }
}

.display-block {
	display: block;
}




/*----------------
  .container
----------------*/
.container {
	margin: 0 auto;
	color: #000;
	line-height: 1.8;
	position: relative;
}

/* section ----------*/
.section {
  overflow: hidden;
  position: relative;
}



/* animation ----------*/
.fade {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
}
.fade.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
.fade-up {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
  transform: translateY(50px);
}
.fade-up.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
@media print, screen and (min-width: 768px) {
  .fade-up {
    transform: translateY(100px);
  }
}
.fade-down {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
  transform: translateY(-50px);
}
.fade-down.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
@media print, screen and (min-width: 768px) {
  .fade-down {
    transform: translateY(-100px);
  }
}
.fade-left {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
  transform: translateX(-50px);
}
.fade-left.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
@media print, screen and (min-width: 768px) {
  .fade-left {
    transform: translateX(-100px);
  }
}
.fade-right {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
  transform: translateX(50px);
}
.fade-right.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
@media print, screen and (min-width: 768px) {
  .fade-right {
    transform: translateX(100px);
  }
}
.fade-top--right {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
  transform: translateY(-20px) translateX(20px);
}
.fade-top--right.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
@media print, screen and (min-width: 768px) {
  .fade-top--right {
    transform: translateY(-100px) translateX(100px);
  }
}
.fade-top--left {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
  transform: translateY(-20px) translateX(-20px);
}
.fade-top--left.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
@media print, screen and (min-width: 768px) {
  .fade-top--left {
    transform: translateY(-100px) translateX(-100px);
  }
}
.fade-bottom--right {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
  transform: translateY(20px) translateX(20px);
}
.fade-bottom--right.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
@media print, screen and (min-width: 768px) {
  .fade-bottom--right {
    transform: translateY(100px) translateX(100px);
  }
}
.fade-bottom--left {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
  transform: translateY(20px) translateX(-20px);
}
.fade-bottom--left.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
@media print, screen and (min-width: 768px) {
  .fade-bottom--left {
    transform: translateY(100px) translateX(-100px);
  }
}

.boyon {
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
}
.boyon.go {
  opacity: 1;
  transform: translateY(0) translateX(0);
  visibility: visible;
}
.boyon.go {
  -webkit-animation: boyon-ani 0.8s ease-out forwards;
          animation: boyon-ani 0.8s ease-out forwards;
}

@-webkit-keyframes boyon-ani {
  0% {
    transform: scale(1);
  }
  30% {
    transform: scale(1.1);
  }
  50% {
    transform: scale(0.9);
  }
  65% {
    transform: scale(1);
  }
  85% {
    transform: scale(0.95);
  }
}

@keyframes boyon-ani {
  0% {
    transform: scale(1);
  }
  30% {
    transform: scale(1.1);
  }
  50% {
    transform: scale(0.9);
  }
  65% {
    transform: scale(1);
  }
  85% {
    transform: scale(0.95);
  }
}
.time-early {
  transition: 0.6s;
}
.time-01 {
  transition-delay: 0.1s;
}
.time-03 {
  transition-delay: 0.3s;
}
.time-05 {
  transition-delay: 0.5s;
}
.time-10 {
  transition-delay: 1s;
}
.time-15 {
  transition-delay: 1.5s;
}
.time-20 {
  transition-delay: 2s;
}
.time-25 {
  transition-delay: 2.5s;
}
.time-30 {
  transition-delay: 3s;
}


/*----------------
  #mainvisual
----------------*/
#mainvisual {
	margin: 0 auto;
	padding: 0;
	font-size: 0;
	overflow: hidden;
	position: relative;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	position: relative;
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: center bottom;
}

#mainvisual img {
    user-drag: none;
    user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    pointer-events: none;
}

#mainvisual .inner {
	margin: 0 auto;
	max-width: 1200px;
	height: 90vw;
	position: relative;
}
#mainvisual .logo_and {
	margin: 3% 10% 0 0;
	width: 17%;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	opacity: 0;
	-webkit-transform: translateY(-10%);
	-ms-transform: translateY(-10%);
	-o-transform: translateY(-10%);
	transform: translateY(-10%);
}

#mainvisual.ani .logo_and {
	opacity: 1;
	transform: translateY(0);
}
#mainvisual .img {
	margin: 18% auto 0 0;
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
	opacity: 0;
	-webkit-transform: translateX(0%);
	-ms-transform: translateX(0%);
	-o-transform: translateX(0%);
	transform: translateX(0%);
}

#mainvisual.ani .img {
	opacity: 1;
	transform: translateX(0);
}
#mainvisual h2 {
	margin: 0 36% 0 0;
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	background:#84a19e;
	opacity: 0;
	-webkit-transform: translateX(-30%);
	-ms-transform: translateX(-30%);
	-o-transform: translateX(-30%);
	transform: translateX(-30%);
}

#mainvisual.ani h2 {
	opacity: 1;
	transform: translateY(0);
}

#mainvisual .txt {
	width: 65%;
	max-width: 880px;
	margin-left: auto;
	opacity: 0;
	-webkit-transform: translateX(-10%);
	-ms-transform: translateX(-10%);
	-o-transform: translateX(-10%);
	transform: translateX(-10%);
}

#mainvisual.ani .txt {
	opacity: 1;
	transform: translateY(0);
}



/*----------------
  #interview
----------------*/
#interview {
	margin: 0 auto;
	padding: 4% 0 1px;
	position: relative;
}

#interview h2 {
	margin: 0 auto 8%;
	font-size: 5.8vw;
	font-weight: bold;
	font-family: 'Geologica', 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, osaka, sans-serif;
	text-align: center;
}

#interview .block {
	margin: 3.2em auto 0;
	padding: 0 4%;
	position: relative;
}

#interview .img {
	margin: 0 auto 5%;
	font-size: 0;
}

#interview p.pillow {
	font-size: 116%;
}

#interview .fst-mv {
	padding: 3rem 0 4rem;
}


#interview .container_top_block {
	width: 100%;
	display: block;
	border-radius: 10px;
	background-color: #f2f2f2;
	margin-bottom: 80px;
}

#interview .container_top_block .contents_l {
	width: 100%;
	padding: 20px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	justify-content: center;
}

#interview .container_top_block .contents_r {
	width: 100%;
	margin-top: -20px;
	padding: 20px;
}

#interview .container_top_block .contents_l img {
	position: relative;
	width: 230px;
	height: 230px;
	border-radius: 100%;
	overflow: hidden;
	z-index: 0;
	border: 8px solid #fff;
}

#interview .container_top_block .contents_r .tx1 {
	font-weight: 500;
	color: #7f5500;
}

#interview .container_top_block .contents_r .tx2 {
	font-weight: 300;
	color: #c18400;
	font-size: 26px;
	padding-right: 12px;
	padding-left: 12px;
}

#interview .container_top_block .contents_r .tx3 {
	font-weight: 700;
	font-size: 22px;
}



#interview p {
	margin: 2.8em auto 0;
	position: relative;
	color: #000;
	font-weight: 300;
}

#interview .a_txt em {
	background: linear-gradient(transparent 60%, #d3eeff 60%);
	position: relative;
}

#interview .btn {
	margin: 10% auto 0;
	width: 87%;
	text-align: center;
}

#interview .btn a {
	padding: 4.5vw 8vw;
	color: #fff;
	font-size: 4vw;
	line-height: 1;
	background: #1560bd;
	border-radius: 50vw;
	display: block;
	position: relative;
}

#interview .btn a::after {
	content: "＞";
	margin-top: -0.5em;
	-webkit-transform: scale(0.6, 1);
	-ms-transform: scale(0.6, 1);
	-o-transform: scale(0.6, 1);
	transform: scale(0.6, 1);
	opacity: 0.6;
	position: absolute;
	top: 50%;
	right: 4%;
}




.p_blue {
	background: linear-gradient(transparent 50%, #e2f6f3 50%);
}

.p_pink {
	background: linear-gradient(transparent 50%, #fdeef5 50%);
}

.p_purple {
	background: linear-gradient(transparent 50%, #f4eaf3 50%);
}

.p_black {
	background: linear-gradient(transparent 50%, #f4f4f4 50%);
}

#interview .annotation {
	margin: 3.2em auto 0;
	position: relative;
	color: #000;
	font-size: 14px;
}

#interview .slick-box {
	margin: 3.2em auto 0;
	background-color: #eef0f0;
	padding: 0 20px 30px;
	width: 100%;
}

#interview .slick-title {
	font-weight: 700;
	font-size: 16px;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
}

.slick-dots li button:before {
	font-size: 12px;
	margin-top: 15px;
}


/*----------------
  #interview bg
----------------*/
#interview div[class^="area"] {
	margin-bottom: 80px;
}

#interview div[class^="area"]:last-child {
	margin-bottom: 0px;
}

#interview .s-txt {
	font-size: 85%;
	margin-top: 5px;
	text-align: center;
	line-height: 140%;
}

#interview .s-txt-r {
	font-size: 77%;
	margin-top: 5px;
	text-align: right;
}

/* ==================================== */

.container_block {
	display: flex;
	margin: 0 auto;
}

.container_block .contents_100 {
	width: 100%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	justify-content: center;
}

.container_block .contents_l_10_90 {
	width: 8%;
}

.container_block .contents_r_10_90 {
	flex: 1;
	width: 88%;
	margin-left: 4%;
}

.container_block .contents_l_20_80 {
	width: 18%;
}

.container_block .contents_r_20_80 {
	flex: 1;
	width: 78%;
	margin-left: 4%;
}

.container_block .contents_l_30_70 {
	width: 28%;
}

.container_block .contents_r_30_70 {
	flex: 1;
	width: 68%;
	margin-left: 4%;
}

.container_block .contents_l_35_65 {
	width: 33%;
}

.container_block .contents_r_35_65 {
	flex: 1;
	width: 63%;
	margin-left: 4%;
}

.container_block .contents_l_40_60 {
	width: 38%;
}

.container_block .contents_r_40_60 {
	flex: 1;
	width: 58%;
	margin-left: 4%;
}

.container_block .contents_l_45_55 {
	width: 43%;
}

.container_block .contents_r_45_55 {
	flex: 1;
	width: 53%;
	margin-left: 4%;
}

.container_block .contents_l_50_50 {
	width: 48%;
}

.container_block .contents_r_50_50 {
	flex: 1;
	width: 48%;
	margin-left: 4%;
}

.container_block .contents_l_55_45 {
	width: 53%;
}

.container_block .contents_r_55_45 {
	flex: 1;
	width: 43%;
	margin-left: 4%;
}

.container_block .contents_l_60_40 {
	width: 58%;
}

.container_block .contents_r_60_40 {
	flex: 1;
	width: 38%;
	margin-left: 4%;
	max-width: 400px;
}

.container_block .contents_l_65_35 {
	width: 63%;
}

.container_block .contents_r_65_35 {
	flex: 1;
	width: 33%;
	margin-left: 4%;
}

.container_block .contents_l_70_30 {
	width: 68%;
}

.container_block .contents_r_70_30 {
	flex: 1;
	width: 28%;
	margin-left: 4%;
}

.container_block .contents_l_80_20 {
	width: 78%;
}

.container_block .contents_r_80_20 {
	flex: 1;
	width: 18%;
	margin-left: 4%;
}

.container_block .contents_l_90_10 {
	width: 88%;
}

.container_block .contents_r_90_10 {
	flex: 1;
	width: 8%;
	margin-left: 4%;
}

.container_block img,
.container_block video {
	margin: 3.2em auto 0;
}

.container_block.mk img,
.container_block.mk video {
	margin: 2.0em auto 0;
}


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

.max-80 {
	max-width: 80px;
}

.max-90 {
	max-width: 90px;
}

.max-100 {
	max-width: 100px !important;
}

.max-120 {
	max-width: 120px !important;
}

.max-150 {
	max-width: 150px !important;
}

.max-178 {
	max-width: 178px !important;
}

.max-200 {
	max-width: 200px !important;
}

.max-220 {
	max-width: 220px !important;
}

.max-250 {
	max-width: 250px !important;
}

.max-300 {
	max-width: 300px !important;
}

.max-370 {
	max-width: 370px !important;
}

.max-400 {
	max-width: 400px !important;
}

.max-418 {
	max-width: 418px !important;
}

.max-430 {
	max-width: 430px !important;
}

.max-450 {
	max-width: 450px !important;
}

.max-465 {
	max-width: 465px !important;
}

.max-470 {
	max-width: 470px !important;
}

.max-480 {
	max-width: 480px !important;
}

.max-500 {
	max-width: 500px !important;
}

.max-519 {
	max-width: 519px !important;
}

.max-520 {
	max-width: 520px !important;
}

.max-525 {
	max-width: 525px !important;
}

.max-550 {
	max-width: 550px !important;
}

.max-580 {
	max-width: 580px !important;
}

.max-600 {
	max-width: 600px !important;
}

.max-620 {
	max-width: 620px !important;
}

.max-630 {
	max-width: 630px !important;
}

.max-650 {
	max-width: 650px !important;
}

.max-700 {
	max-width: 700px !important;
}

.max-750 {
	max-width: 750px !important;
}

.max-770 {
	max-width: 770px !important;
}

.max-800 {
	max-width: 800px !important;
}

.max-820 {
	max-width: 820px !important;
}

.max-850 {
	max-width: 850px !important;
}

.max-900 {
	max-width: 900px !important;
}

.max-950 {
	max-width: 950px !important;
}

.max-960 {
	max-width: 960px !important;
}

.max-1000 {
	max-width: 1000px !important;
}

.max-1080 {
	max-width: 1080px !important;
}


.float-r {
	float: left;
}



/*----------------
  h3 タイトル
----------------*/

.title-outer-l {
	background: #fff;
	-webkit-box-shadow: 15px 15px 0 #84a19e;
	box-shadow: 15px 15px 0 #84a19e;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #84a19e;
	border-bottom-color: #84a19e;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #84a19e;
	margin-left: -15px;
	margin-right: 30px;
	padding-left: 15px;
}
.title-outer-r {
	background: #fff;
	-webkit-box-shadow: 15px 15px 0 #84a19e;
	box-shadow: 15px 15px 0 #84a19e;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #84a19e;
	border-bottom-color: #84a19e;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #84a19e;
	margin-left: 15px;
}

.title-outer-l h3.ttl_txt {
	width: 100%;
	text-align: left;
	padding: 1em 16px 1em 1em;
	margin-left: auto;
	font-size: 27px;
	font-weight: 500;
	color: #57706c;

}

.title-outer-r h3.ttl_txt {
	width: 100%;
	text-align: left;
	padding: 1em;
	margin-right: auto;
	font-size: 27px;
	font-weight: 500;
	color: #57706c;
}


/*----------------
  table
----------------*/

.table-area {
	width: 100%;
	margin: 1em auto 0;
	overflow-x: scroll;
}

.table-area img {
	max-width: 155px;
}

table.sp-table {
	width: 100%;
	margin: 0 auto 2em;
}

table.sp-table {
	border-collapse: separate;
	border-spacing: 8px 0px;
	font-size: 15px;
	text-align: center;
	font-weight: 500;
}

table.sp-table th,
table.sp-table td {
	width: 190px;
	min-width: 190px;
	padding: 10px 5px;
	line-height: 140%;
}

table.sp-table th {
	background-color: #c5ede8;
	font-size: 15px;
}

table.sp-table td {
	background-color: #fff;
	margin-top: auto;
	margin-bottom: auto;
	vertical-align: middle;
	align-items: center;
}

table.sp-table td.koumoku {
	font-size: 16px;
}

table.sp-table tr.transparent td {
	background: none;
	padding: 0;
	height: 110px;
}

table.sp-table tr th:first-child,
tr td:first-child {
	width: 120px;
	min-width: 120px;
}

table.sp-table .h100 {
	height: 106px;
	display: flex;
    justify-content: center;
    align-items: center;
}



.line-color {
	padding: 0.4em;
	border: 1px solid #000;
	border-radius: 10px;
	font-size: 15px;
	min-height: 54px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.line-color sup {
	color: #0079fa;
}

.line-color.green {
	border: 1px solid #527c77;
	background: #527c77;
	color: #fff;
}

.line-color.green sup {
	color: #fff;
}


.line-color.s_txt {
	font-size: 12px;
}

.line-color.m_txt {
	font-size: 14px;
}

.button001 a {
	background: #606060;
	border-radius: 3px;
	position: relative;
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin: 15px auto 0;
	max-width: 280px;
	padding: 7px 15px;
	color: #fff;
	transition: 0.3s ease-in-out;
	font-weight: 500;
}

.button001 a:hover {
	background: #8f8f8f;
	text-decoration: none;
}

.button001 a:after {
	content: '';
	width: 5px;
	height: 5px;
	border-top: 3px solid #fff;
	border-right: 3px solid #fff;
	transform: rotate(45deg) translateY(-50%);
	position: absolute;
	top: 50%;
	right: 20px;
	border-radius: 1px;
	transition: 0.3s ease-in-out;
}

.button001 a:hover:after {
	border-color: #fff;
}

.box_arrow {
	width: 95%;
	max-width: 190px;
	height: 80px;
	background-color: #ffc0cb;
	clip-path: polygon(0 0, 0 70%, 50% 100%, 100% 70%, 100% 0, 50% 0%);
	margin-left: auto;
	margin-right: auto;
	padding-top: 12px;
	font-weight: 500;
	color: #fff;
	font-size: 15px;
	line-height: 130%;
}

.box_arrow.pink {
	background: #ffdbbd;
	color: #000 !important;
}

.title_area5 {
	position: relative;
	padding: 0 65px;
	text-align: center;
}

.title_area5:before {
	position: absolute;
	top: calc(50% - 1px);
	left: 0;
	width: 100%;
	height: 2px;
	content: '';
	background: #829f9c;
}

.title_area5 span {
	position: relative;
	padding: 0 1em;
	background: #fff;
	font-size: 123.1%;
	color: #829f9c;
	font-weight: 700;
}

/*----------------
  メイキング
----------------*/

.areaex {
	margin-top: 25rem;
}
.box-area {
	width: 100%;
	border: 2px solid #84a19e;
	padding: 0 50px 50px;
	text-align: center;
	margin: 0 auto 0;
	justify-content: center;
}
.box-area p.txt {
	margin: 30px auto 0 !important;
	font-weight: 700 !important;
}
.making {
	max-width: 344px;
	margin: -123px auto 0;
	text-align: center;
	justify-content: center;
}
.making img {
    user-drag: none;
    user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    pointer-events: none;
}


@media screen and (min-width: 1200px) {
	#mainvisual .inner {
		height: 1100px;
	}
	.box-area {
		width: calc(100% + (100px));
		margin: 0 -50px;
	}
}
@media screen and (min-width: 1025px) {
	.table-area {
		overflow-x: auto;
	}
	table.sp-table {
		width: 100%;
	}
}

@media screen and (min-width: 980px) {

	/*----------------
	  h3 タイトル
	----------------*/
	.title-outer-l {
		max-width: calc(100% - (50% - 520px));
	}
	.title-outer-r {
		max-width: calc(100% - (50% - 520px));
		margin-left: auto;
	}
	.title-outer-l h3.ttl_txt {
		max-width: 1000px;
		padding: 1em 16px 1em 16px;
	}
	.title-outer-r h3.ttl_txt {
		max-width: 1000px;
		padding: 1em 0 1em 32px;
	}
	.right-adjustment {
		padding-right: 0;
	}
	.left-adjustment {
		padding-left: 16px;
	}
}

@media only screen and (max-width: 767px) {
	/*----------------
	  #mainvisual
	----------------*/
	#mainvisual.ani h2 {
		-webkit-transition: all 0.5s 0.1s;
		-o-transition: all 0.5s 0.1s;
		transition: all 1.0s 0.1s;
	}
	#mainvisual.ani .txt {
		-webkit-transition: all 0.5s 0.5s;
		-o-transition: all 0.5s 0.5s;
		transition: all 0.5s 0.5s;
	}
	#mainvisual.ani .logo_and {
		-webkit-transition: all 1.3s 1.3s;
		-o-transition: all 1.3s 1.3s;
		transition: all 1.0s 1.3s;
	}
	#mainvisual.ani .img {
		-webkit-transition: all 0.8s 0.8s;
		-o-transition: all 0.8s 0.8s;
		transition: all 0.8s 0.8s;
	}
}

@media only screen and (min-width: 769px) {

	.sp_only {
		display: none;
	}

	/*----------------
	  .container
	----------------*/
	.container {
		overflow: hidden;
	}

	/*----------------
	  #mainvisual
	----------------*/
	#mainvisual.ani h2 {
		-webkit-transition: all 0.5s 0.1s;
		-o-transition: all 0.5s 0.1s;
		transition: all 1.0s 0.1s;
	}
	#mainvisual.ani .txt {
		-webkit-transition: all 0.5s 0.5s;
		-o-transition: all 0.5s 0.5s;
		transition: all 0.5s 0.5s;
	}
	#mainvisual.ani .logo_and {
		-webkit-transition: all 0.8s 0.8s;
		-o-transition: all 0.8s 0.8s;
		transition: all 0.8s 0.8s;
	}
	#mainvisual.ani .img {
		-webkit-transition: all 1.3s 1.3s;
		-o-transition: all 1.3s 1.3s;
		transition: all 1.0s 1.3s;
	}
	


	/*----------------
	  #interview
	----------------*/
	#interview {
		padding: 30px 0 1px;
	}

	#interview h2 {
		margin: 0 auto 50px;
		font-size: 60px;
	}
	
	#interview p {
		margin: 3.2em auto 0;
		position: relative;
		font-size: 17px;
	}

	#interview .block {
		margin: 3.2em auto 0;
		padding: 0 20px;
		max-width: 1000px;
	}

	#interview .img {
		margin: 0 auto 90px;
	}

	#interview .container_top_block {
		display: flex;
		margin-bottom: 100px;
	}
	
	#interview .container_top_block p {
		font-size: 15px;
	}

	#interview .container_top_block .contents_l {
		width: 270px;
	}

	#interview .container_top_block .contents_r {
		width: calc(100% - 270px);
		margin-top: auto;
		margin-bottom: auto;
	}

	#interview .container_top_block .contents_r .tx2 {
		font-size: 28px;
	}

	#interview .container_top_block .contents_r .tx3 {
		font-size: 24px;
	}

	#interview .a_txt em {
		background: linear-gradient(transparent 60%, #d3eeff 60%);
		position: relative;
	}

	#interview .btn {
		margin: 70px auto 0;
		width: 480px;
	}

	#interview .btn a {
		padding: 25px 20px;
		font-size: 25px;
		border-radius: 50px;
	}

	#interview .slick-box {
		padding: 0 40px 40px;
	}

	#interview .slick-title {
		font-size: 24px;
		padding-top: 40px;
		padding-bottom: 30px;
	}

	/*----------------
	  #interview bg
	----------------*/
	#interview div[class^="area"] {
		margin-bottom: 150px;
	}

	#interview .s-txt {
		font-size: 14px;
	}

	#interview .s-txt-r {
		font-size: 58%;
	}





	.container_block img {
		margin: 3.2em auto 0;
	}

	.container_block section[class^="contents_l"].child_2 {
		order: 2;
		margin-left: 4%;
	}

	.container_block section[class^="contents_r"].child_1 {
		order: 1;
		margin-left: 0;
	}

	/*----------------
	  #prologue
	----------------*/
	#prologue {
		padding: 130px 0 1px;
	}

	#prologue .block {
		margin: 0 auto 5em;
		padding: 0 20px;
		max-width: 1000px;
	}


	/*タイトル付き（ラベルボックス）*/
	.sbox .inner .txt {
		font-size: 77%;
	}

}

@media only screen and (max-width: 767px) {
	.sp_center {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		justify-content: center;
	}

	/* ==================================== */

	.container_block {
		display: block;
		margin: 0 auto;
	}

	.container_block section[class^="contents_l"] {
		width: 100%;
	}

	.container_block section[class^="contents_r"] {
		width: 100%;
		margin-left: 0;
		margin-top: 0;
	}

	/* ==================================== */

	/*----------------
	  h3 タイトル
	----------------*/
	.title-outer-l h3.ttl_txt,
	.title-outer-r h3.ttl_txt {
		font-size: 20px;
	}
	
	/*----------------
	  #mainvisual
	----------------*/
	#mainvisual .inner {
		height: 145vw;
	}
	#mainvisual .logo_and {
		margin: 5% auto 6% auto;
		width: 65%;
		max-width: 503px;
		z-index: 1;
		top: 0;
		right: 0;
		position: initial;
	}

	#mainvisual .img {
		margin: 0 auto 0 auto;
		position: initial;
	}

	#mainvisual h2 {
		margin: 0 auto 0 auto;
		width: 100%;
		position: initial;
	}
	#mainvisual .txt {
		width: 100%;
		margin: 0 auto;
	}
	
	/*----------------
	  メイキング
	----------------*/
	.areaex {
		margin-top: 12rem;
	}
	.box-area {
		border: 1px solid #84a19e;
		padding: 0 20px 30px;
	}
	.box-area p.txt {
		margin: 20px auto 0 !important;
	}
	.making {
		max-width: 172px;
		margin: -61.5px auto 0;
	}


}