@charset "utf-8";
/* CSS Document */
/*---------------------------------------
#manual共通
---------------------------------------*/
/* main */
.manual_main {
 position: relative;
 padding: 20px 0;
 padding-right: 360px;
}
.manual_main::before {
 content: "";
 width: 100vw;
 height: 100%;
 background: url("../img/manual_img05.jpg") repeat left top / 256px auto;
 position: absolute;
 top: 0;
 left: 50%;
 margin-left: -50vw;
 z-index: -1;
}
.manual_main::after {
 content: "";
 width: 100vw;
 height: 100%;
 background:linear-gradient(135deg, rgba(255, 254, 142,0.4) 0%, rgba(12, 155, 250,0.4) 100%);
 position: absolute;
 top: 0;
 left: 50%;
 margin-left: -50vw;
 z-index: -1;
}
.manual_main .ill {
 width: 300px;
 height: 100%;
 min-height: 225px;
 display: flex;
 align-items: center;
 justify-content: center;
 position: absolute;
 right: 0;
 top: 0;
}
.manual_main .manual_main_title {
 color: #00619D;
 line-height: 1.3;
}
.manual_main .manual_main_title .small { font-size: 0.8em; }
.manual_main .manual_main_title .bg {
 font-size: 0.6em;
 display: inline-block;
 background-color: #00619D;
 border-radius: 4px;
 color: #fff;
 line-height: 1.6;
 padding: 0 10px;
 margin: 0 0 10px;
}
/* faq */
.faq_box_wrap { counter-reset: num; }
.faq_box {
 background-color: #fff;
 padding: 20px 20px 10px;
}
.faq_box + .faq_box { margin-top: 20px; }
.faq_box .question {
 margin: 0;
 color: #00a3ce;
 line-height: 1.4;
 padding-left: 60px;
 position: relative;
 counter-increment: num;
 min-height: 50px;
 display: flex;
 align-items: center;
}
.faq_box .question::before {
 content: "Q"counter(num);
 display: flex;
 align-items: center;
 justify-content: center;
 width: 50px;
 height: 50px;
 background-color: #00a3ce;
 border-radius: 100%;
 color: #fffe9d;
 font-size: 18px;
 font-weight: bold;
 line-height: 1;
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
}
/*---------------------------------------
#manual.top
---------------------------------------*/
#manual.top .etr202manual_alp_sec1 .bg_box {
 background: url("../img/manual_bg02.jpg") no-repeat left bottom / 146px auto;
 padding-left: 180px;
 position: relative;
}
#manual.top .etr202manual_alp_sec1 .bg_box::before {
 content: "";
 width: 146px;
 height: 100%;
 background-color: #d2f2ff;
 position: absolute;
 left: 0;
 top: 0;
 z-index: -1;
}
#manual.top .etr202manual_alp_sec1 .bg_box:last-child { background-position: left top; }
#manual.top .etr202manual_alp_sec1 .bg_box .schedule {
 width: 146px;
 display: block;
 text-align: center;
 position: absolute;
 left: 0;
 top: 20px;
}
.etr202manual_alp_sec3 {
 background-color: #FEF9F0;
 border: 1px solid #FFE6B7;
 padding: 12px;
 color: #C23300;
 margin: 20px 0;
}
.etr202manual_alp_sec3 > p { margin: 0; }
.etr202manual_alp_sec1 .btn {
 display: table;
 margin: 20px auto;
}
.etr202manual_alp_sec1 .btn > div {
 display: table-cell;
 vertical-align: middle;
}
.etr202manual_alp_sec4 {
 position: relative;
 padding: 2px 0 40px;
 margin-top: 40px;
}
.etr202manual_alp_sec4::before {
 content: "";
 width: 100vw;
 height: 100%;
 background-color: #E3F9FF;
 position: absolute;
 top: 0;
 left: 50%;
 margin-left: -50vw;
 z-index: -1;
 }
.etr202manual_alp_sec9 .attention02 {
 color: #C21800;
 font-size: 12px;
 padding: 10px 0 0 0;
 text-align: left;
 text-indent: -1em;
}
.etr202manual_alp_sec5 ul:not([class]),
.etr202manual_alp_sec5 ul.list01,
.etr202manual_alp_sec6 ul:not([class]) {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 column-gap: 20px;
 row-gap: 20px;
}
.etr202manual_alp_sec5 ul:not([class]) > li,
.etr202manual_alp_sec6 ul:not([class]) > li {
 background: url("../img/manual_bg04.gif") no-repeat left top / 29px auto;
 padding-left: 40px;
 line-height: 1.6;
 min-height: 26px;
}
.etr202manual_alp_sec5 ul.list01 li { margin-top: 10px; }
.etr202manual_alp_sec5 .bg {
 width: 80%;
 margin: 30px auto 0;
 border: solid 4px #f4f4f4;
 padding: 20px;
}
.etr202manual_alp_sec5 .bg > h4 { margin-top: 0; }
.etr202manual_alp_sec11 {
 width: 80%;
 margin: 30px auto 0;
 border: solid 4px #f4f4f4;
 padding: 20px;
}
.etr202manual_alp_sec10 .box {
 background:#F7EEF7 url("../img/manual_bg05") repeat-x top 0 left -50px / auto 32px;
 padding: 2px 20px 20px; 
}
.etr202manual_alp_sec10 .box + .box { margin-top: 20px; }
.etr202manual_alp_sec10 .box:nth-of-type(2) { background-color: #FFF5D5; }
.etr202manual_alp_sec10 .box:nth-of-type(3) { background-color: #DFFFF3; }
.etr202manual_alp_sec10 .box .text { overflow: hidden; }
.etr202manual_alp_sec10 .box .text > div:first-child {
 float: right;
 margin: 0 0 20px 10px;
}
/*---------------------------------------
#manual.yoyaku
---------------------------------------*/
.yoyaku_sec02 .point_box div:first-child {
 display: inline-block;
 padding: 7px 20px 4px 20px;
 background-color: #0872CC;
 font-weight: bold;
 line-height: 1.2;
 color: #ffffff;
 position: relative;
 border-radius: 20px; 
}
.yoyaku_sec02 .point_box div:first-child::before {
 content: "";
 width: 10px;
 height: 7px;
 background: url("../img/yoyaku_bg06.png") no-repeat center top / 100% auto;
 position: absolute;
 bottom: -7px;
 left: 3em;
}
.yoyaku_sec02 .point_box ul {
 border-bottom: 1px solid #CCCCCC;
 border-left: 1px solid #CCCCCC;
 border-right: 1px solid #CCCCCC;
 background: URL("../img/yoyaku_bg05.png") repeat-y;
 margin: 10px 0 0 0;
}
.yoyaku_sec02 .point_box ul li {
 border-top: 1px solid #CCCCCC;
 padding: 4px 5px 4px 45px;
 position: relative;
 color: #C67100;
 background: url("../img/yoyaku_icon02.png") no-repeat;
 background-position: 6px center;
}
.yoyaku_sec02 .bg_box {
 background: url("../img/manual_bg02.jpg") no-repeat left bottom / 146px auto;
 padding-left: 180px;
 position: relative;
}
.yoyaku_sec02 .bg_box::before {
 content: "";
 width: 146px;
 height: 100%;
 background-color: #d2f2ff;
 position: absolute;
 left: 0;
 top: 0;
 z-index: -1;
}
.yoyaku_sec02 .bg_box:last-child { background-position: left top; }
.yoyaku_sec02 .bg_box .step {
 width: 146px;
 display: block;
 text-align: center;
 position: absolute;
 left: 0;
 top: 20px;
}
.yoyaku_sec02 h4.bold {
 background-color: #0872CC;
 border-radius: 1000px;
 padding: 10px;
 color: #fff;
}
.yoyaku_sec02 .tehai_box {
 background-color: #FFF8D5;
 border: 1px solid #E3A600;
 margin: 30px 0;
}
.yoyaku_sec02 .tehai_box > div:first-child {
 text-align: center;
 padding: 8px 10px 5px 10px;
 background: url(/img/yoyaku_bg04.png) repeat-x;
 background-position: left top;
 background-color: #F8CA04;
 font-size: 18px;
 font-weight: bold;
 line-height: 1.3;
 color: #F01D00;
 text-shadow: 1px 1px 1px #fff, -1px 1px 1px #fff, 1px -1px 1px #fff, -1px -1px 1px #fff, 2px 1px 1px #fff, -2px 1px 1px #fff, 2px -1px 1px #fff, -2px -1px 1px #fff, 1px 2px 1px #fff, -1px 2px 1px #fff, 1px -2px 1px #fff, -1px -2px 1px #fff, 1px 1px 2px #000;
}
.yoyaku_sec02 .tehai_box .clm > div:first-child { margin-bottom: 10px; }
.yoyaku_sec05,
.yoyaku_sec07 {
 position: relative;
 padding: 2px 0 30px;
 margin-top: 40px;
}
.yoyaku_sec05::before,
.yoyaku_sec07::before {
 content: "";
 width: 100vw;
 height: 100%;
 background-color: #E3F9FF;
 position: absolute;
 top: 0;
 left: 50%;
 margin-left: -50vw;
 z-index: -1;
}
/*---------------------------------------
#manual.keiyaku
---------------------------------------*/
.keiyaku_sec02 { text-align: center; }
.keiyaku_sec02 .catch {
 padding: 5px 15px 5px 15px;
 color: #ffffff;
 font-size: 26px;
 font-weight: bold;
 background-color: #FF8000;
 display: inline-block;
 margin: 40px auto 20px;
}
.keiyaku_sec02 .clm_wrap + .clm_wrap { margin-top: 60px; }
.keiyaku_sec02 .clm {
 background-color: #f4f4f4;
 padding: 20px 10px;
}
.keiyaku_sec02 .clm.text {
 text-align: left;
 background: none;
 padding: 0;
}
.keiyaku_sec02 .clm h2 { margin-top: 0; }
.keiyaku_sec02 .clm .pic {
 display: flex;
 align-items: center;
 min-height: 255px;
 background-color: #fff;
 padding: 10px;
}
.keiyaku_sec02 .clm .merit,
.keiyaku_sec02 .clm .demerit {
 margin: 20px 0 0;
 border: 1px solid #FFA101;
 text-align: left;
 background-color: #fff;
}
.keiyaku_sec02 .clm .merit dt,
.keiyaku_sec02 .clm .demerit dt {
 letter-spacing: 1px;
 border-top: 1px solid #FFE27D;
 border-left: 1px solid #FFE27D;
 border-right: 1px solid #FFE27D;
 border-bottom: 2px solid #E4E4D4;
 padding: 8px 10px 4px 10px;
 color: #FF3100;
 font-size: 1.2em;
 font-weight: bold;
 background: url(/img/keiyaku_bg06.gif) repeat-x left top;
 background-color: #FFA101;
 text-shadow: 0 -1px 0 #ffffff, 1px 0 0 #ffffff, 0 1px 0 #ffffff, -1px 0 0 #ffffff;
 text-align: center;
}
.keiyaku_sec02 .clm .merit dd,
.keiyaku_sec02 .clm .demerit dd { padding: 10px; }
.keiyaku_sec02 .clm .demerit { border-color: #3D4E56; }
.keiyaku_sec02 .clm .demerit dt {
 border-top: 1px solid #A3B1B9;
 border-left: 1px solid #A3B1B9;
 border-right: 1px solid #A3B1B9;
 border-bottom: 2px solid #A0A8AB;
 padding: 8px 10px 4px 10px;
 color: #ffffff;
 font-size: 17px;
 font-weight: bold;
 background: url(/img/keiyaku_bg07.gif) repeat-x left top;
 background-color: #2A3B43;
 text-shadow: none;
}
.keiyaku_sec02 > p { text-align: left; }
/*---------------------------------------
#manual.mitumori
---------------------------------------*/
.mitumori_sec02 .bg {
 background-color: #CFC;
 padding: 10px;
 display: inline-block;
}
.mitumori_sec02 .bg > div:first-child { font-weight: bold; }
.mitumori_sec02 .list01 {
 margin-top: 30px;
 background-color: #f4f4f4;
 padding: 20px;
 font-size: 0.9em;
}
/*---------------------------------------
#manual.attention
---------------------------------------*/
#manual.attention .pic { text-align: center; }
.attention_sec01 .clm { text-align: left; }
.attention_sec01 .clm .pic { text-align: center; }
.attention_sec01_title {
 font-size: 28px;
 margin-left: 25px;
 background-color: #f4f4f4;
 border-radius: 1000px;
 padding: 10px 40px;
 text-align: center;
 line-height: 1.4;
 position: relative;
}
.attention_sec01_title::after {
 content: "";
 width: 50px;
 height: 44px;
 background: url("../img/attention_ico01.png") no-repeat left top / 100% auto;
 position: absolute;
 left: -15px;
 top: 50%;
 margin-top: -22px;
}
.attention_sec02 .prohibition {
 background: url("../img/attention_bg02.png") no-repeat 104% 40% #FFFFBF;
 padding: 14px;
 margin-bottom: 20px;
}
.attention_sec02 .attentionBox { padding: 20px; }
.attention_sec02 .attentionBox dd + dt { margin-top: 10px;}
/*---------------------------------------
#manual.safety
---------------------------------------*/
.safety_sec01,
.safety_sec03 {
 position: relative;
 padding: 2px 0 40px;
 margin-top: 40px;
}
.safety_sec01::before,
.safety_sec03::before {
 content: "";
 width: 100vw;
 height: 100%;
 background-color: #E3F9FF;
 position: absolute;
 top: 0;
 left: 50%;
 margin-left: -50vw;
 z-index: -1;
}
.safety_sec05 .clm { text-align: left; }
.safety_sec05 .point { padding: 60px 0 0 0; }
.safety_sec05 .point dl{
	border:3px solid #FF652D;
	background-color:#FFF8C7;
	border-radius: 6px;
	padding:0 20px 10px 20px;
}
.safety_sec05 .point dl dt{
	margin:-60px 0 0 0;
	text-align:center;
}
.safety_sec05 .point dl dd{
	font-weight:bold;
	line-height:1.3;
	color:#222222;
	background:url("../img/safety_icon01.png") no-repeat left 0.5em;
	padding:13px 0 0 35px;
	min-height:37px;
}
.safety_sec01 .bg {
 background-color: #fff;
 padding: 20px;
}
.safety_sec01 .bg + .bg { margin-top: 30px; }
.safety_sec01 .bg > h3:first-child { margin-top: 0; }
.safety_sec01 .photo_text .photo .note {
 text-align: left;
 background-color: #f4f4f4;
 padding: 10px;
}
.safety_sec01 .terms {
 border-radius: 6px;
 margin: 20px 0;
 padding: 20px;
 background-color: #FFF8C7;
}
.safety_sec01 .terms dl dt { font-weight: bold; }
.safety_sec01 .terms dl dd {
 background: url("../img/safety_icon02.png") no-repeat left 0 top 0.3em;
 padding-left: 20px;
 line-height: 1.4;
 margin: 10px 0 0;
}
.safety_sec01 ol {
 display: table;
 border-spacing: 12px;
 table-layout: fixed;
 margin: 0 auto;
}
.safety_sec01 ol li {
 display: table-cell;
 height: 60px;
 font-weight: bold;
 line-height: 1.2;
 color: #ffffff;
 background: url("../img/safety_text02.png") no-repeat 7px center;
 background-color: #2F87D4;
 border-radius: 6px;
 padding:10px;
 padding-left: 56px;
 vertical-align: middle;
}
.safety_sec01 ol li:nth-child(2) { background-image: url("../img/safety_text03.png"); }
.safety_sec01 ol li:nth-child(3) { background-image: url("../img/safety_text04.png"); }
.safety_sec01 .check {
 margin: 20px auto;
 border: 1px solid #BEBEBE;
 border-radius: 6px;
 display: table;
 width: 80%;
}
.safety_sec01 .check div {
 display: table-cell;
 vertical-align: middle;
 padding: 10px;
 font-size: 1.4em;
 font-weight: bold;
 line-height: 1.4;
 color: #222222;
}
.safety_sec01 .check div:first-child { width: 111px; }
.safety_sec02 .guideline {
 border-radius: 6px;
 margin: 20px 0;
 padding: 20px;
 background-color: #FFF8C7;
 counter-reset: gl;
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 grid-row-gap: 20px;
}
.safety_sec02 .guideline li {
 width: 48%;
 counter-increment: gl;
 padding-left: 40px;
 line-height: 1.4;
 position: relative;
 min-height: 30px;
 display: flex;
 align-items: center;
}
.safety_sec02 .guideline li::before {
 content: counter(gl , decimal-leading-zero);
 display: flex;
 align-items: center;
 justify-content: center;
 width: 30px;
 height: 30px;
 background-color: #00a3ce;
 border-radius: 6px;
 color: #fff;
 font-size: 12px;
 font-weight: bold;
 line-height: 1;
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
}
.safety_sec02 .team {
 width: 80%;
 margin: 30px auto;
 border: solid 1px #ccc;
 padding: 20px 20px 0;
 border-radius: 6px;
}
.safety_sec02 .team .name {
 font-size: 17px;
 line-height: 1.2;
 font-weight: bold;
 color: #ffffff;
 padding: 7px 20px 4px 20px;
 background-color: #0872CC;
 border-radius: 1000px;
 text-align: center;
}
.safety_sec02 .team ul {
 padding: 20px;
 background-color: #f4f4f4;
 margin: 20px 0;
}
.safety_sec02 .team p {
 position: relative;
 padding-right: 120px; 
 min-height: 151px;
 margin-bottom: 0;
}
.safety_sec02 .team p::after {
 content: "";
 width: 97px;
 height: 151px;
 background: url("../img/safety_img08.png") no-repeat center bottom / 100% auto;
 position: absolute;
 right: 0;
 bottom: 0;
}
.safety_sec02 .team p span {
 color: #FF470E;
 font-weight: bold;
}
.safety_sec02 .spiralup {
 overflow: hidden;
 width: 62%;
 margin: 30px auto 0;
 display: flex;
}
.safety_sec02 .spiralup .left {
 width: 163px;
 margin-right: 20px;
}
.safety_sec02 .spiralup .right {
 width: calc(100% - 183px);
}
.safety_sec02 .spiralup .right p {
 margin: 0 0 10px;
 font-size: 1.2em;
 line-height: 1.3;
 font-weight: bold;
 color: #ffffff;
 padding: 15px 20px 15px 20px;
 background-color: #0872CC;
 border-radius: 6px;
}
.safety_sec02 .spiralup .right p span { color: #FFFF26; }
.safety_sec03 .photo_text .photo {
 background-color: #fff;
 padding: 20px 10px 2px;
}



@media screen and (max-width: 960px) {
 /*---------------------------------------
 #manual共通
 ---------------------------------------*/
 /* main */
 .manual_main { padding: 0 0 20px; }
 .manual_main::before { background-size: 128px auto; }
 .manual_main .manual_main_title {
  height: 140px;
  padding-top: 20px;
  text-shadow: 0px 0px 5px #fff;
 }
 .manual_main .manual_main_title .bg { text-shadow: none; }
 .manual_main .ill {
  top: 0;
  right: -16px;
  width: 100vw;
  height: 140px;
  min-height: auto;
  z-index: -1;
  overflow: hidden;
 }
 .manual_main .ill img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 55%;
 }
 /*---------------------------------------
 #manual.top
 ---------------------------------------*/
 #manual.top .etr202manual_alp_sec1 .bg_box {
  background-size: 100px auto;
  padding-left: 120px;
 }
 #manual.top .etr202manual_alp_sec1 .bg_box::before,
 #manual.top .etr202manual_alp_sec1 .bg_box .schedule { width: 100px; }
 .etr202manual_alp_sec5 ul:not([class]),
 .etr202manual_alp_sec5 ul.list01,
 .etr202manual_alp_sec6 ul:not([class]) { display: block; }
 .etr202manual_alp_sec5 ul:not([class]) li,
 .etr202manual_alp_sec5 ul.list01 li,
 .etr202manual_alp_sec6 ul:not([class]) li { margin-top: 10px; }
 .etr202manual_alp_sec5 .bg,
 .etr202manual_alp_sec11 { width: 100%; }
 /*---------------------------------------
 #manual.yoyaku
 ---------------------------------------*/
 .yoyaku_sec02 .bg_box {
  background-size: 100px auto;
  padding-left: 120px;
 }
 .yoyaku_sec02 .bg_box::before,
 .yoyaku_sec02 .bg_box .step { width: 100px; }
 /*---------------------------------------
 #manual.keiyaku
 ---------------------------------------*/
 .keiyaku_sec02 .clm_wrap + .clm_wrap { margin-top: 20px; }
 .keiyaku_sec02 .clm .pic { min-height: auto; }
 /*---------------------------------------
 #manual.attention
 ---------------------------------------*/
 .attention_sec02 .clm_wrap {
  display: flex;
  flex-wrap: wrap;
  column-gap: normal;
  justify-content: space-evenly;
  margin-top: 0;
 }
 .attention_sec02 .clm_wrap .clm {
  flex: none;
  width: 33%;
  margin: 20px 0 0;
 }
 .attention_sec01_title { font-size: 20px; }
 /*---------------------------------------
 #manual.safety
 ---------------------------------------*/
 .safety_sec01 ol { display: block; }
 .safety_sec01 ol li + li { margin-top: 10px; }
 .safety_sec01 ol li {
  display: flex;
  align-items: center;
 }
 .safety_sec01 .check { width: 100%; }
 .safety_sec01 .check div { font-size: 1em; }
 .safety_sec02 .guideline {
  padding: 10px;
  display: block;
 }
 .safety_sec02 .guideline li { width: 100%; }
 .safety_sec02 .guideline li + li { margin-top: 10px; }
 .safety_sec02 .team { width: 100%; }
 .safety_sec02 .spiralup { width: 100%; }
 .safety_sec02 .spiralup .left { display: none; }
 .safety_sec02 .spiralup .right { width: 100%; }
 .safety_sec02 .spiralup .right ul {
  background: url("../img/safety_img10.png") no-repeat right 50% / 120px auto;
  padding-right: 130px;
  min-height: 177px;
 }
}



