
@charset "utf-8";


/* ==================================================
  base
================================================== */

.main_content {
  line-height: 1.375;
}
.main_content img {
  height: auto;
}
.main_content.w_100vw {
  overflow-x: clip;
}
.main_content sup {
  vertical-align: top;
  position: relative;
  top: .7em;
  font-size: 10px;
  line-height: 0;
}



/* ==================================================
  common
================================================== */

/* ----------------------------------------
  cont_wrap
---------------------------------------- */

.cont_wrap {
  padding: 20px 20px 40px;
}

@media (min-width: 768px) {
  .cont_wrap {
    padding: 30px 30px 60px;
  }
}

@media (min-width: 1024px) {
  .cont_wrap {
    padding: 40px 30px 80px;
  }
}



/* ----------------------------------------
  p
---------------------------------------- */

.main_content div + p,
.main_content ul + p,
.main_content ol + p,
.main_content dl + p,
.main_content table + p,
.main_content img + p {
  margin-top: 1em;
}


/* ----------------------------------------
	a
---------------------------------------- */

.content a {
	color: #000;
	text-decoration: underline;
}
.content a:hover {
	text-decoration: none;
}



/* ----------------------------------------
  c-button
---------------------------------------- */

.main_content * + [class*="c-button"] {
  margin-top: 20px;
}


/* ----------------------------------------
	title
---------------------------------------- */

.title {
	padding: 30px 20px 0;
	/*border-bottom: 1px solid #000;*/
}

@media screen and (min-width: 768px) {
	.title {
		padding-right: 30px;
		padding-left: 30px;
	}
}


/* ----------------------------------------
	list_basic
---------------------------------------- */

.list_basic.space > li:nth-child(n+2) {
	margin-top: 1.2em;
}


.marker {
    padding: 0 .3em;
    background: #fad4d3;
}


/* ==================================================
	local_navi
================================================== */

@media screen and (max-width: 1023px) {
	.local_navi_trigger {
		display: flex;
		align-items: center;
		min-height: 62px;
	}
	.local_navi_trigger::before {
		color: #000;
	}
	.local_navi_trigger h2 {
		padding: 10px 0;
		font-size: 20px;
		font-weight: normal;
		line-height: 1.2;
	}
	.local_navi_menu > h2 {
		display: none;
	}
	.local_navi_menu_level1 > li {
		background: #fff;
		border-color: #e8e8e8;
	}
	.local_navi_menu_level1 > li a {
		color: #000;
	}
	.local_navi_menu_level1 > li a br {
		display: none;
	}
	.local_navi_menu_level1 > li > a:not(:only-child) {
		border-color: #e8e8e8;
	}
	.local_navi_menu_level1 > li.local_navi_level2_open {
		background: #fff;
	}
	.local_navi_menu_level2 > li {
		background: rgba(243,243,243,1);
		border-top: none;
	}
	.local_navi_level2_trigger::after {
		color: #000;
	}
}

@media screen and (min-width: 1024px) {
	.local_navi {
		right: 50%;
		left: 50%;
		width: 100vw;
		margin-right: -50vw;
		margin-left: -50vw;
		padding: 0 20px;
		background: #fff;
	}
	.local_navi .local_navi_menu {
		display: flex !important;
		justify-content: space-between;
		align-items: center;
		max-width: 1220px;
		margin: 0 auto;
	}
	.local_navi_menu a {
		color: #000;
	}
	.local_navi_menu > h2,
	.local_navi_menu > h2 a {
		color: #000;
		font-size: 20px;
		font-weight: normal;
		line-height: 1;
		text-decoration: none;
		margin: 0;
	}
	.local_navi_menu > h2 a:hover {
		text-decoration: underline;
	}
	.local_navi_menu_level1 {
		display: flex;
		justify-content: space-between;
	}
	.local_navi_menu_level1 > li:nth-of-type(n+2) {
		margin-left: 30px;
	}
	.local_navi_menu_level1 > li.main_menu {
		height: 70px;
	}
	.local_navi_menu_level1 > li.main_menu > a {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		width: 100%;
		height: 100%;
		color: #000;
		line-height: 1.4;
	}
	.local_navi_menu_level1 > li.current::after,
	.local_navi_menu_level1 > li.main_menu > a:hover::after {
		display: block;
		content: "";
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 4px;
		background: #165dba;
	}

	/* level2 -------------------- */
	.local_navi_menu_level2_area {
		top: 100%;
		left: -20px;
	}
	.local_navi_menu_level2 {
		min-width: 300px;
		background: #fff;
		border: 1px solid #e8e8e8;
		box-shadow: 0 12px 12px 0 rgb(0 0 0 / 20%);
	}
	.local_navi_menu_level2 li a {
		display: block;
		padding: 10px 20px;
		text-align: left;
		transition: .2s;
		white-space: nowrap;
	}
	.local_navi_menu_level2 li a:hover {
		color: #165dba;
		text-decoration: none;
		background: #e6fcff; /*rgba(44,48,56,.05)*/
	}
}



/* ----------------------------------------
	main_menu_btn
---------------------------------------- */

.local_navi .main_menu_btn {
	padding: 1.2rem 1.6rem;
	text-align: center;
}
.local_navi .main_menu_btn .button {
	display: inline-block;
	width: 200px;
	background: #165dba;
}
.local_navi .main_menu_btn .button:hover {
	background: #114a94;
}

@media screen and (min-width: 1024px) {
	.local_navi .main_menu_btn {
		align-self: center;
		position: relative;
		padding: 0;
		margin-left: auto;
	}
}

@media screen and (min-width: 1024px) and (max-width: 1279px) {
	.local_navi .main_menu_btn .button {
		width: auto;
	}
}



/* ==================================================
  hero
================================================== */

.hero {
  display: flex;
  flex-direction: column;
  max-width: 1920px;
  margin: 0 auto;
}
.hero .cont .inner {
  padding: 30px 20px 50px;
}
.hero .badge {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 50px;
}
.hero .badge a:hover img {
  opacity: 1;
}
.hero .media img {
  object-fit: cover;
  width: 100%;
  height: auto;
}

@media (min-width: 768px) {
  .hero .cont .inner {
    padding-right: 30px;
    padding-left: 30px;
  }
}

@media (min-width: 1280px) {
  .hero {
    flex-direction: row;
    min-height: 600px;
  }
  .hero .cont {
    width: calc(50% - 193px);
  }
  .hero .cont .inner {
    max-width: calc(416px + 30px);
    padding-top: 50px;
    margin-left: auto;
  }
  .hero h2,
  .hero h3 {
    position: relative;
    width: max-content;
  }
  .hero .media {
    width: calc(50% + 193px);
  }
  .hero .media img {
    height: 100%;
  }
}

@media (min-width: 1920px) {
  .hero .cont {
    width: calc(50% - 93px);
  }
  .hero .cont .inner {
    max-width: calc(516px + 30px);
  }
  .hero .media {
    width: calc(50% + 93px);
  }
}





/* ==================================================
	overview
================================================== */

/* ----------------------------------------
	overview_cont
---------------------------------------- */

.overview_cont .img_area img {
	width: 100%;
}
.overview_cont .text_area {
	margin-top: 20px;
}
.overview_cont .list_basic {
	margin-top: 1em;
}
.overview_cont .list_basic > li {
	padding-bottom: .5em;
	border-bottom: 1px solid #000;
}

@media screen and (min-width: 1024px) {
	.overview_cont {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}
	.overview_cont .img_area {
		width: 55%;
	}
	.overview_cont .text_area {
		width: calc(45% - 40px);
		margin-top: 0;
	}
}



/* ----------------------------------------
	prod_link
---------------------------------------- */

.prod_link > li {
	margin: -1px 0 0 -1px;
	border: 1px solid #000;
}
.prod_link .inner {
	padding: 20px;
}
.prod_link .img_area {
	padding: 10px 5px;
	text-align: center;
	background: #e6e6e6;
}
.prod_link .text_area {
	margin-top: 20px;
}
.prod_link h3 {
	margin-bottom: 10px;
}
.prod_link .list_basic > li {
	margin-top: 0;
}
.prod_link .link_area {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	margin: 20px 0 0 -15px;
}
.prod_link .link_area::before {
	content: "";
	position: absolute;
	top: 0;
	left: 15px;
	width: calc(100% - 15px);
	height: 1px;
	background: #000;
}
.prod_link .link_area a {
	margin: 20px 0 0 15px;
	letter-spacing: -.1em;
}
.prod_link .link_area .button {
	padding: .5em .8em;
}
.prod_link .link_area a.text_link {
	display: flex;
	align-items: center;
	position: relative;
	color: #000;
	text-decoration: none;
}
.prod_link .link_area a.text_link::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	transition: .3s;
	width: 0;
	height: 1px;
	background: #000;
}
.prod_link .link_area a.text_link:hover {
	text-decoration: none;
}
.prod_link .link_area a.text_link:hover::after {
	width: 100%;
}

@media screen and (min-width: 480px) {
	.prod_link {
		display: flex;
		flex-wrap: wrap;
	}
	.prod_link > li {
		width: 50%;
	}
}

@media screen and (min-width: 1024px) {
	.prod_link > li {
		width: calc(100% / 3);
	}
}

@media screen and (min-width: 1280px) {
	.prod_link > li {
		width: calc(100% / 4);
	}
}




/* ==================================================
	flow
================================================== */

/* ----------------------------------------
	flow_table
---------------------------------------- */

.flow_table td:first-child {
	width: 130px;
}
.flow_table .notes {
	margin-top: 1em;
}

@media screen and (max-width: 767px) {
	table.flow_table {
		width: 700px;
		white-space: normal;
	}
}




/* ==================================================
	spec_price
================================================== */

.spec_price {
	padding: 40px 20px;
	color: #fff;
	background: #000;
}
.spec_price_list {
	margin: -20px -15px;
}
.spec_price_list > li {
	padding: 20px 15px;
}

@media screen and (min-width: 480px) {
	.spec_price_list {
		display: flex;
		flex-wrap: wrap;
	}
	.spec_price_list > li {
		width: 50%;
		padding: 30px 15px;
	}
}

@media screen and (min-width: 768px) {
	.spec_price {
		padding-right: 30px;
		padding-left: 30px;
	}
}

@media screen and (min-width: 1024px) {
	.spec_price_list {
		flex-wrap: nowrap;
	}
	.spec_price_list > li {
		flex: 1;
		width: auto;
	}
}



/* ----------------------------------------
	price_table
---------------------------------------- */

.price_table {
	margin-top: 10px;
}

@media screen and (max-width: 767px) {
	.price_table dt:nth-child(n+2) {
		margin-top: 10px;
	}
	.price_table dd {
		padding-left: 1em;
	}
}

@media screen and (min-width: 768px) {
	.price_table dt {
		float: left;
		clear: both;
	}
	.price_table dd {
		padding-left: 11.5em;
	}
}





/* ==================================================
	register
================================================== */

/* ----------------------------------------
	register_table
---------------------------------------- */
.sTable.register_table thead th {
	background: #e6e6e6;
}
@media screen and (max-width: 767px) {
	table.register_table {
		width: 700px;
		white-space: normal;
	}
}

.inquiry_title .heading {
	    border-top: 1px #000 solid;
}
