/*-----------------------------------------------------------
        ƒwƒbƒ_[
-----------------------------------------------------------*/
div.snsbutton {
	padding: 0;
	margin: 0;
}

div.snsbutton ul li {
	padding: 0;
	margin: 0;
	float: left;
	display: inline;
	vertical-align: bottom;
	width: 110px;
}

.twitbutton {
	width: 110px !important;
}

.clear {
	margin: 0px;
	padding: 0px;
	clear: both;
	font-size: 0px;
	font-style: normal;
	line-height: 0px;
	font-weight: normal;
	font-variant: normal;
}

/* SNSボタン設定用！
---------------------------------------------------- */
.sns {
	padding: 5px 0 5px 0;
}

.sns .facebook {
	float: left;
	margin-bottom: 5px;
}

.sns .titter {
	float: left;
	width: 110px;
	margin-left: 5px;
}

.box_ytb {
	width: 100%;
	height: auto;
	aspect-ratio: 16/9;
}

.box_ytb iframe {
	width: 100%;
	height: 100%;
	border: none;
}

#header {
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	background-color: rgba(255, 255, 255, 0.95);
	z-index: 9998;
	box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);
}

#large-stock {
	width: 100%;
	max-width: 1200px;
	margin: 20px auto 0;
}

.search_container {
	position: relative;
	box-sizing: border-box;
	border: 2px solid #3879d9;
	display: block;
	padding: 3px 10px;
	border-radius: 3px;
	height: 2.3em;
	width: 650px;
	overflow: hidden;
	margin-top: 6px;
}

.search_container input[type='text'] {
	border: none;
	height: 2em;
}

.search_container input[type='text']:focus {
	outline: 0;
}

.search_container input[type='submit'] {
	cursor: pointer;
	font-family: FontAwesome;
	border: none;
	background: #3879d9;
	color: #fff;
	position: absolute;
	width: 3.5em;
	height: 3em;
	right: 0px;
	top: -5px;
	outline: none;
}

@media only screen and (max-width: 768px) {
	#header {
		height: 180px;
	}

	.sns {
		padding: 0 !important;
	}

	#large-stock {
		margin: 140px auto 0;
	}
}

/*-- ƒƒS --*/
#header-logo {
	float: left;
	height: 47px;
	margin-top: 10px;
	margin-left: 26px;
	margin-right: 24px;
}

.logo_komeri01 {
	position: absolute;
}

@media only screen and (max-width: 768px) {
	#header-logo {
		margin-left: 12px;
	}

	.top-icon {
		right: 51px;
		position: fixed;
	}
}

/*-- ƒAƒCƒRƒ“ --*/
#header-icon {
	position: fixed;
	/*float:right;*/
	top: 10px;
	left: 240px;
}

.totop {
	margin-top: 10px;
	margin-right: 4px;
}

@media only screen and (max-width: 768px) {
	#header-icon {
		right: 110px;
		position: fixed;
	}

	.totop {
		margin-right: 55px;
	}
}

@media only screen and (max-width: 1120px) {
	#header-icon {
		display: none;
		/*display:block;*/
		width: 50px;
	}

	/*#header-icon2{
    display:none;
    display:block;
    margin-top:5px;
}*/
}

@media only screen and (max-width: 360px) {
	#header-logo {
		height: 0;
	}
}

#header-icon ul {
	float: left;
	margin-right: 10px;
}

#header-icon li {
	float: left;
}

#header-icon li a {
	display: block;
	width: 40px;
	height: 50px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 24px 24px;
}

#header-icon li.twitter a {
	background-image: url(../img/common/tw.png);
}

#header-icon li.youtube a {
	background-image: url(../img/common/yt.png);
}

#header-icon li.facebook a {
	background-image: url(../img/common/fb.png);
}

/*.shopping-icon {
    float:left;
}
.shopping-icon a{
    display:block;
    height:50px;
    line-height:50px;
    background-color: #1e2875;
    color:#fff;
    padding:0 20px;
    padding-left:64px;
    background-image:url(/contents/howto/html_new/img/common/shopping-icon.png);
    background-repeat:no-repeat;
    background-position:left 20px center;
    background-size: 24px 24px;
}
@media only screen and (max-width: 768px) {
.shopping-icon a{
    width:50px;
    margin-right:1px;
    padding:0;
    padding-left:0;
    background-position:center center;
    text-indent:-9999px;
}
}*/

.shopping-icon {
	float: right;
	margin-top: 10px;
}

.top-icon {
	float: right;
	margin-top: 10px;
	display: none;
}

.shopping-icon a {
	display: block;
	height: 50px;
	line-height: 50px;
	background-color: #e00012;
	color: #fff;
	padding: 0 20px;
	padding-left: 64px;
	background-image: url(../img/common/shopping-icon.png);
	background-repeat: no-repeat;
	background-position: left 20px center;
	background-size: 24px 24px;
}

.top-icon a {
	display: block;
	height: 50px;
	line-height: 50px;
	background-color: #297bc4;
	color: #fff;
	padding: 0 20px;
	padding-left: 64px;
	background-image: url(../img/common/home.png);
	background-repeat: no-repeat;
	background-position: left 20px center;
	background-size: 24px 24px;
}

.corporate-icon {
	float: left;
}

.corporate-icon a {
	display: block;
	height: 50px;
	line-height: 50px;
	background-color: #e00012;
	color: #fff;
	padding: 0 20px;
	padding-left: 64px;
	background-image: url(../img/common/corporate-icon.png);
	background-repeat: no-repeat;
	background-position: left 20px center;
	background-size: 24px 24px;
}

@media only screen and (max-width: 768px) {
	.shopping-icon a {
		width: 50px;
		margin-right: 1px;
		padding: 0;
		padding-left: 0;
		background-position: center center;
		text-indent: -9999px;
	}

	.top-icon {
		display: block;
	}

	.top-icon a {
		width: 50px;
		margin-right: 1px;
		padding: 0;
		padding-left: 0;
		background-position: center center;
		text-indent: -9999px;
	}

	.corporate-icon a {
		width: 50px;
		padding: 0;
		padding-left: 0;
		background-position: center center;
		text-indent: -9999px;
	}
}

#header-icon a {
	display: block;
	color: #fff;
}

#header-icon a:hover {
	color: #fff;
}

#header-icon a:link {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

#header-icon a:visited {
	color: #fff;
}

.shopping-icon a:link {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

.top-icon a:link {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

/*-----------------------------------------------------------
        ƒOƒ[ƒoƒ‹ƒiƒrƒQ[ƒVƒ‡ƒ“
-----------------------------------------------------------*/
#header-nav {
	/*float:none;
    width:100%;
    display:block;
    list-style:none;
    overflow:hidden;
}
@media only screen and (min-width: 1320px) {
#header-nav{*/
	float: left;
	margin-left: 10px;
	margin-top: 3px;
	/*width:840px;*/
	clear: both;
}

/*}*/
#header-nav ul {
	margin: 0 auto;
	/*width:840px;*/
	overflow: hidden;
}

#naviArea {
	display: none;
}

@media only screen and (max-width: 768px) {
	#header-nav {
		display: none;
	}

	#naviArea {
		display: block;
	}
}

#header-nav li {
	float: left;
}

#header-nav li a {
	height: 36px;
	line-height: 36px;
	display: block;
	text-align: center;
	font-size: 14px;
	padding: 5px 1.3em;
	background-repeat: no-repeat;
	background-position: left center;
}

/*@media only screen and (min-width: 1080px) {
#header-nav li a {
    padding:5px 1.6em;
}
}*/
#header-nav li:last-child a {
	background-position: left center, right center;
}

#header-nav li a:hover {
}

#header-nav li a:link {
	color: #333;
	text-decoration: none;
	font-weight: bold;
}

#header-nav li a:visited {
	color: #333;
}

.floatR {
	float: right;
}

.wide375 {
	width: 375px;
	margin-top: 10px;
}

.wide375s {
	display: none;
}

/*.wide375 img{
    padding:10px;
}*/
.floatL {
	float: left;
}

@media only screen and (max-width: 768px) {
	.wide375 {
		margin-top: 20px;
	}
}

@media only screen and (max-width: 650px) {
	.wide375 {
		display: none;
	}

	.wide375s {
		display: block;
		/*margin:5px;*/
		margin-top: 10px;
	}
}

@media only screen and (max-width: 345px) {
	.totop {
		margin-top: 0;
	}
}

.snsbotan {
	height: 36px;
	line-height: 36px;
	display: block;
	padding: 5px 1.3em;

	background-repeat: no-repeat;
	background-position: left center;
}

@media only screen and (max-width: 768px) {
	.snsbotan {
		background-image: none;
	}
}

@charset "UTF-8";

/* CSS Document */
.mgt10 {
	margin-top: 10px;
}

.mgt20 {
	margin-top: 20px;
}

.mgt30 {
	margin-top: 30px;
}

.mgt40 {
	margin-top: 40px;
}

.mgb10 {
	margin-bottom: 10px;
}

.mgb20 {
	margin-bottom: 20px;
}

.mgb30 {
	margin-bottom: 30px;
}

.mgb40 {
	margin-bottom: 40px;
}

.mgb60 {
	margin-bottom: 60px;
}

.mgb100 {
	margin-bottom: 100px;
}

body {
	margin: 0px;
	font-size: 100%;
	font-family: 'ＭＳ Ｐゴシック', 'MS PGothic', verdana, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, Sans-Serif;
	color: #333333;
}

.webfont {
	font-family: 'Noto Sans JP', '游ゴシック', 'Yu Gothic', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', verdana, Osaka, Sans-Serif;
}

#wrapper {
	padding-top: 200px;
}

#wrapper img {
	height: auto;
}

#wrapper ul {
	list-style: none;
}

#large-stock {
	margin: -110px auto 0px;
	padding-top: 75px;
}

#wrapper .h3-anchor {
	margin-top: -16vh;
	padding-top: 100px;
}

#wrapper .inner {
	padding: 0 10px !important;
}

#wrapper .feature-hdg1 {
	position: relative;
}

#wrapper .feature-hdg1 .sub_title {
	color: #fff;
	text-shadow: 1px 1px 2px rgba(10, 10, 10, 0.7);
	text-align: center;
	font-weight: bold;
	font-size: 70px;
	margin-left: 0;
	padding: 15px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	line-height: 1.1;
	width: 70%;
	letter-spacing: 0.05em;
	font-feature-settings: 'palt' 1;
	background-color: rgba(0, 0, 0, 0.2);
}

#wrapper .feature-hdg1.big .sub_title {
	width: 90%;
}

@media screen and (max-width: 1280px) {
	#wrapper .feature-hdg1.big .sub_title {
		font-size: 6vw;
	}
	#wrapper .feature-hdg1.big_sp .sub_title {
		width: 86%;
		font-size: 6vw;
	}
	#wrapper .feature-hdg1.fwsp .sub_title {
		font-size: 8vw;
	}
}

#wrapper .feature-hdg1 .sub_title-secondary {
	font-size: 0.75em;
	display: block;
	margin-top: 1.25rem;
}

#wrapper .description {
	background: #cfcfcf;
	text-align: left;
	line-height: 1.6;
	padding: 10px 20px;
	margin: 0;
	margin-bottom: 30px;
	font-size: 14px;
}

#wrapper .breadcrumb2 {
	margin-bottom: 0.6em;
	color: #83838f;
}

#wrapper .breadcrumb2 .breadcrumbs {
	padding-left: 10px;
	margin-top: 0;
	margin-bottom: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	font-size: 0.8rem;
	line-height: 1.5;
}

#wrapper .breadcrumb2 li::before {
	content: '\FF1E';
	width: 1em;
	height: 1em;
	line-height: 1;
	text-align: center;
	font-size: 1em;
	color: inherit;
	position: absolute;
	top: 50%;
	right: 0;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

#wrapper .breadcrumb2 li:last-child::before {
	content: ' ';
}

#wrapper .breadcrumb2 a {
	text-decoration: none;
	color: #83838f;
}

#wrapper .breadcrumb2 li:last-child {
	margin-right: 0;
	padding-right: 0;
}

#wrapper .breadcrumb2 li {
	display: inline-block;
	position: relative;
	padding-right: calc(12px + 4px);
	margin-right: 8px;
	color: #83838f;
}

#wrapper .feature-hdg2 {
	position: relative;
	padding-bottom: 1.25rem;
	border-bottom: 3px solid #b6b6b6;
	font-size: 28px;
	margin-bottom: 30px;
	line-height: 1.2;
	padding-top: 0;
	margin-top: 50px;
}

#wrapper .feature-hdg2::after {
	position: absolute;
	content: ' ';
	border-bottom: solid 3px #e5002d;
	bottom: -3px;
	width: 8%;
	display: block;
}

#wrapper .lead-text {
	font-size: 18.4px;
	line-height: 1.5;
	padding-top: 10px;
}

#wrapper .c-text {
	margin: 0 auto;
	width: 50%;
}

#wrapper .feature-hdg3 {
	margin-top: calc(50px - 0.6rem);
	margin-bottom: calc(30px - 0.75rem);
	line-height: 1.3;
	border-left: 4px solid #e5002d;
	padding: 0 0.5rem;
	font-size: 1.3em;
}
#wrapper .feature-hdg3.mgt0 {
	margin-top: 0;
}

#wrapper .flatbtn {
	box-sizing: border-box;
	text-align: center;
	border-radius: 999px;
	color: #333;
	display: flex;
	opacity: 1;
	width: auto;
	height: 100%;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	text-decoration: none;
	z-index: 1;
}

#wrapper .flatbtn:hover,
#wrapper .flatbtn:focus {
	text-decoration: none;
	opacity: 0.75;
	transition: 0.6s;
}

#wrapper .flatbtn:active,
#wrapper .flatbtn.active {
	outline: 0;
	box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.125);
}

#wrapper .flatbtn.disabled,
#wrapper .flatbtn[disabled],
#wrapper .flatbtn.disabled:hover,
#wrapper .flatbtn[disabled]:hover,
#wrapper .flatbtn.disabled:active,
#wrapper .flatbtn[disabled]:active {
	cursor: not-allowed;
	opacity: 0.65;
	filter: alpha(opacity=65);
	box-shadow: none !important;
}

#wrapper .default-btn {
	background: #979797;
}

#wrapper .orange-btn {
	background: #ea6d0d;
}

#wrapper .red-btn {
	background: #e50012;
}

#wrapper .blue-btn {
	background: #19499c;
}

#wrapper .mustard-btn {
	background: #d7ab1a;
}

#wrapper .default-btn,
#wrapper .orange-btn,
#wrapper .red-btn,
#wrapper .blue-btn,
#wrapper .mustard-btn {
	color: #fff;
}

#wrapper .border-btn {
	border: 1px solid #b6b6b6;
}

#wrapper .border-btn:hover {
	border-color: #e5002d;
}

#wrapper .border-btn.selected {
	border-color: #d4122c;
}

#wrapper .border-btn-orange {
	border: 1px solid #ea6d0d;
	color: #ea6d0d;
}

#wrapper .arrow-r,
#wrapper .arrow-d {
	position: relative;
}

#wrapper .arrow-r::after {
	content: '';
	position: absolute;
	right: 18px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	width: 8px;
	height: 8px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 0;
	bottom: 0;
	margin: auto;
}

#wrapper .arrow-r-orange::after {
	border-color: #ea6d0d;
}

#wrapper .arrow-r-red::after {
	border-color: #e5002d;
}

#wrapper .arrow-d::after {
	content: '';
	position: absolute;
	right: 15px;
	border-top: 2px solid #b6b6b6;
	border-right: 2px solid #b6b6b6;
	width: 8px;
	height: 8px;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
	top: 0;
	bottom: 0;
	margin: auto;
}

@media screen and (max-width: 767px) {
	#wrapper .arrow-d::after {
		right: 12px;
	}
}

#wrapper .arrow-d-red::after {
	border-color: #e5002d;
}

#wrapper .arrow-d-orange::after {
	border-color: #ea6d0d;
}

#wrapper .mwbtn {
	max-width: 480px;
	margin: 0 auto;
}

#wrapper .fs-small {
	font-size: 0.8em;
	padding: 0.8rem 1.2rem;
}

#wrapper .fs-medium {
	font-size: 1em;
	padding: 0.8rem 0.2rem;
}

#wrapper .fs-large {
	font-size: 1.62em;
	padding: 1.05rem 1rem;
}

#pageTop {
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 9999;
	width: 80px;
	height: 80px;
}

#pageTop img {
	width: 100%;
	height: auto;
}

#wrapper .modal {
	display: none;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 2;
}

#wrapper .modal__bg {
	background: rgba(0, 0, 0, 0.5);
	height: 100vh;
	position: absolute;
	width: 100%;
}

#wrapper .modal__content {
	background: #fff;
	left: 50%;
	padding: 40px;
	position: absolute;
	top: 58%;
	transform: translate(-50%, -50%);
	width: 60%;
}

#wrapper .modal_txtbox {
	max-width: 350px;
	margin: 0 auto;
}

#wrapper .item-name {
	font-size: 1.2rem;
	font-weight: bold;
}

#wrapper .modal_imgbox {
	max-width: 350px;
	margin: 0 auto;
}

#wrapper .close-right {
	display: flex;
	justify-content: flex-end;
}

#wrapper .tab-menu-nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
	margin: 0 auto;
}

#wrapper .tab-menu-nav .fs-medium {
	padding: 0.5rem 2rem 0.5rem 1rem;
	font-feature-settings: 'palt';
	min-height: 3rem;
	line-height: 1.3;
}

#wrapper .tab-menu-nav li {
	width: calc(25% - 15px);
	margin-bottom: 1.25em;
	font-size: 14px;
}

/* ---- ƒ{ƒ^ƒ“ƒƒjƒ…[ ---- */
#wrapper .menu-btn-list {
	display: flex;
	flex-wrap: wrap;
	margin: 1rem 0 0;
}

#wrapper .menu-btn-list li {
	width: 100%;
	margin-bottom: 1em;
	line-height: 1.2;
}

#wrapper .menu-btn-list li:last-child {
	margin-bottom: 0;
}

#wrapper .menu-btn-list .fs-large {
	padding: 0.5rem 2rem 0.5rem 1rem;
	font-feature-settings: 'palt';
	min-height: 3rem;
	font-size: 1em;
}

/* -- ƒ{ƒ^ƒ“ƒƒjƒ…[ end --  */

#wrapper table {
	width: 100%;
	border-collapse: collapse;
	font-size: 18.4px;
}

#wrapper table th,
#wrapper table td {
	border: solid 1px #333333;
	padding: 10px 5px;
	vertical-align: middle;
	font-size: 18.4px;
}

#wrapper table th {
	background: #eaffd8;
}

#wrapper table th.bg2 {
	background: #99cc99;
}

#wrapper table th.bgn {
	background: #fff;
}

#wrapper .img-box01 {
	max-width: 700px;
	width: 100%;
	margin: 0 auto;
}

#wrapper .howto-2col {
	display: flex;
	align-items: flex-start;
}

#wrapper .howto-2col .txtbox-01 {
	width: 60%;
}

#wrapper .howto-2col .imgbox-01 {
	width: 40%;
	padding: 10px 20px 0px 0px;
	flex-shrink: 0;
}

#wrapper .feature-hdg4 {
	font-size: 1.15rem;
	margin-top: calc(30px - 0.6rem);
	margin-bottom: calc(20px - 0.75rem);
	padding-bottom: 0.5rem;
	line-height: 1.3;
}

#wrapper .howto-2col .imgbox-01 img {
	object-fit: cover;
}

#wrapper .goods {
	display: flex;
	flex-wrap: wrap;
	margin-top: 10px;
}

#wrapper .border_radiuse li,
.border_radiuse-supervision {
	box-sizing: border-box;
	border: 1px solid #ccc;
	border-radius: 5px;
	overflow: hidden;
}
.center {
	text-align: center;
}

#wrapper .links {
	display: flex;
}

#wrapper .links li {
	width: calc(25% - 10px);
	margin-right: 10px;
	margin-bottom: 20px;
	display: flex;
	flex-direction: column;
	padding: 10px;
}

#wrapper .col-2 {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 100%;
}

#wrapper .col-2 li {
	width: calc(50% - 10px);
	margin-right: 0;
}

#wrapper .links.col-3 {
	padding-left: 0;
}
#wrapper .links.col-3 li {
	width: calc((100% - 20px) / 3);
	margin-right: 10px;
	margin-bottom: 10px;
}
#wrapper .links.col-3 li:nth-child(3n + 3) {
	margin-right: 0;
}

#wrapper .links li a {
	width: 100%;
	text-decoration: none;
}

#wrapper .links li img {
	//margin-top: auto;
	width: 100%;
}

#wrapper .links li .fs-medium {
	padding: 0.5rem 2rem 0.5rem 1rem;
	font-feature-settings: 'palt';
	min-height: 3rem;
	line-height: 1.3;
	font-size: 0.85rem;
}

#wrapper .supervision {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
}

#wrapper .supervition_img {
	flex-basis: 35%;
}

#wrapper .supervision img {
	width: 100%;
	height: auto;
}

#wrapper .supervision_text {
	flex-basis: 65%;
	display: flex;
	justify-content: center;
	flex-direction: column;
	padding-right: 5px;
}

#wrapper #supervision_red {
	color: red;
	margin: 30px 0;
}

#wrapper .supervision_text > h4 {
	font-weight: bold;
}

#wrapper .text-box {
	color: black;
}

@media only screen and (min-width: 767px) {
	#wrapper .menu-btn-list.col-1 li {
		width: calc(60% - 10px);
	}

	#wrapper .maindesign .menu-btn-list .fs-large {
		font-feature-settings: 'palt';
		min-height: 3rem;
		font-size: 1.5em;
	}

	#wrapper .maindesign .menu-btn-list.col-1 .flatbtn {
		border-radius: 60px;
	}

	#wrapper .howto-2col-row .imgbox-01 {
		width: 100px;
		padding: 0px 100px 0px 0px;
	}

	#wrapper .sp-only {
		display: none;
	}
}

@media only screen and (max-width: 768px) {
	#large-stock {
		margin: 0 auto;
		padding: 0;
	}

	#wrapper .feature-hdg1 .sub_title {
		//font-size: 25px;
	}

	#wrapper .description {
		font-size: 13px;
	}

	#wrapper .tab-menu-nav {
		width: 100%;
		justify-content: space-between;
	}

	#wrapper .tab-menu-nav li {
		width: calc(50% - 0.5rem);
		font-size: 12px;
	}

	#wrapper .tab-menu-nav + .feature-hdg2 {
		margin-top: 30px;
	}

	#wrapper table {
		font-size: 12.8px;
	}

	#wrapper .lead-text {
		font-size: 15.2px;
	}

	#wrapper .h3-anchor {
		font-size: 16px;
	}

	#wrapper .feature-hdg2 {
		font-size: 24px;
	}

	#wrapper .feature-hdg3 {
		margin: 5px 0;
		font-size: 20px;
	}

	#wrapper .h3-anchor {
		padding-top: 5px;
	}

	#wrapper .howto-2col {
		flex-direction: column;
	}

	#wrapper .howto-2col-row {
		flex-direction: row !important;
	}

	#wrapper .howto-2col .txtbox-01 {
		width: 100%;
		margin-right: 0;
	}

	#wrapper .howto-2col .imgbox-01 {
		width: 100%;
		text-align: center;
		padding-right: 0;
	}

	#wrapper .links li {
		width: calc(50% - 5px);
		margin-right: 0;
	}

	#wrapper .links {
		justify-content: space-between;
		margin: 30px 0;
	}

	#wrapper .pc-only {
		display: none;
	}

	#pageTop {
		bottom: 25px;
		right: 15px;
		width: 42px;
		height: 42px;
	}

	#wrapper .maindesign .menu-btn-list .fs-large {
		padding: 0.5rem 2rem 0.5rem 1rem;
		font-feature-settings: 'palt';
		min-height: 3rem;
		font-size: 1em;
	}
}

#wrapper .top_down img {
	padding: 0px 100px 0px 0px;
	margin-bottom: 0;
}

#wrapper .right_left {
	margin-bottom: 0;
	display: flex;
	align-items: center;
}

#wrapper .right_left p {
	margin-left: 25px;
}

#wrapper .kanren-item {
	background-color: #edecec;
	margin-top: 20px;
	padding: 20px 20px;
}

#wrapper .kanren-item p {
	padding: 0;
	margin-bottom: 10px;
}

#wrapper .kanren-item p:last-child {
	margin-bottom: 0;
}
/*#wrapper h4 {
    text-decoration: #297bc4 solid underline;
}*/

#wrapper .tab-menu-nav::before {
	order: 1;
}

#wrapper .tab-menu-nav::before,
#wrapper .tab-menu-nav::after {
	content: '';
	display: block;
	width: calc(25% - 15px);
	height: 0;
}

.kanren ul li {
	list-style-type: none;
	background: url(../../image/common/icon4.gif) no-repeat 0 0.2em;
	padding-left: 22px;
}

a:link {
	text-decoration: none;
	color: #0099cc;
}

.clearfix:after {
	content: '.';
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

#wrapper img {
	width: 100%;
}

#wrapper .img-box {
	width: 30%;
}

#wrapper .img-box-75 {
	width: 75%;
}

#wrapper .img-box-35 {
	width: 35%;
}

#wrapper .img-box-36 {
	width: 36%;
}

#wrapper .img-box-60 {
	width: 60%;
}

#wrapper .img-box-65 {
	width: 65%;
}

#wrapper .img-box-30 {
	width: 30%;
}

#wrapper .kanren-item:first-child {
	margin-top: 20px;
}

@media only screen and (max-width: 768px) {
	#wrapper .right_left {
		display: block;
	}

	#wrapper .top_down img {
		padding: 0;
		margin-bottom: 0;
	}

	#wrapper .right_left {
		padding: 0;
	}

	#wrapper .feature-hdg1 .sub_title {
		font-size: 30px;
	}

	#wrapper .feature-hdg3 {
		margin-top: 35px;
	}

	#wrapper .right_left p {
		margin: 0;
	}

	#wrapper .img-box {
		width: 100%;
	}

	#wrapper .kanren-item {
		background-color: #edecec;
		margin-bottom: 20px;
		padding: 10px 10px;
	}

	#wrapper .img-box-75 {
		width: 100%;
	}

	#wrapper .img-box-35 {
		width: 100%;
	}

	#wrapper .img-box-60 {
		width: 100%;
	}

	#wrapper .img-box-65 {
		width: 100%;
	}

	#wrapper .img-box-30 {
		width: 100%;
	}

	#wrapper .img-box-36 {
		width: 100%;
	}
	#wrapper .howto-2col-row .imgbox-01 {
		width: 30%;
		padding: 0px 40px 0px 0px;
	}

	#wrapper .maindesign .menu-btn-list .fs-large {
		padding: 0.5rem 2rem 0.5rem 1rem;
		font-feature-settings: 'palt';
		min-height: 3rem;
		font-size: 1em;
	}
}

/*==================  FIX ============== */
#wrapper .link_h {
	text-decoration: underline;
}
#wrapper .vt_fix img {
	width: auto;
	max-width: 100%;
}
#wrapper .vt_fix img.full {
	width: 100%;
}
#wrapper .vt_fix .banner-list li img,
#wrapper .vt_fix .feature-hdg1 img {
	width: 100%;
}
#wrapper .vt_fix .bold {
	font-weight: bold;
}
#wrapper .vt_fix .border {
	border: 1px solid #ccc;
	padding: 10px;
}
#wrapper .vt_fix .f_big {
	font-size: 1.2em;
}
#wrapper .vt_fix .f_sm {
	font-size: 90%;
}
#wrapper .vt_fix .red {
	color: red;
}
#wrapper .vt_fix .right {
	text-align: right;
}
#wrapper .cus_ttl4 {
	margin: 10px 0 5px;
	padding: 0 0 5px;
	border-bottom: 1px dotted #ccc;
	font-size: 20px;
}
#wrapper .box_ytb_txt {
	display: flex;
	align-items: center;
}
#wrapper .box_ytb_txt .box_ytb {
	width: 400px;
	height: auto;
	aspect-ratio: 16/9;
	flex-shrink: 0;
	margin-right: 30px;
}

#wrapper .banner_w50 {
	width: 50%;
}
#wrapper .banner_w50 img {
	width: 100%;
}
#wrapper .list_brn {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#wrapper .list_brn p {
	margin: 30px 0 0;
	width: calc((100% - 30px) / 2);
}
#wrapper .list_brn p img {
	width: 100%;
}
#wrapper .underline {
	text-decoration: underline;
}
#wrapper .line {
	border-bottom: 2px solid #297bc4;
	padding-bottom: 20px;
	margin-bottom: 20px;
}

/* WIDTH */
.w10 {
	width: 10%;
}
.w15 {
	width: 15%;
}
.w20 {
	width: 20%;
}
.w25 {
	width: 25%;
}
.w30 {
	width: 30%;
}
.w35 {
	width: 35%;
}
.w40 {
	width: 40%;
}
.w45 {
	width: 45%;
}
.w50 {
	width: 50%;
}

/* MARGIN LEFT */
.mgl10 {
	margin-left: 10px;
}
.mgl15 {
	margin-left: 15px;
}
.mgl20 {
	margin-left: 20px;
}
.mgl25 {
	margin-left: 25px;
}
.mgl30 {
	margin-left: 30px;
}
.mgl40 {
	margin-left: 40px;
}
.mgl50 {
	margin-left: 50px;
}
.mgl60 {
	margin-left: 60px;
}
.mgl70 {
	margin-left: 70px;
}
.mgl80 {
	margin-left: 80px;
}
.mgl90 {
	margin-left: 90px;
}

/* MARGIN RIGHT */
.mgr10 {
	margin-right: 10px;
}
.mgr15 {
	margin-right: 15px;
}
.mgr20 {
	margin-right: 20px;
}
.mgr25 {
	margin-right: 25px;
}
.mgr30 {
	margin-right: 30px;
}
.mgr40 {
	margin-right: 40px;
}
.mgr50 {
	margin-right: 50px;
}
.mgr60 {
	margin-right: 60px;
}
.mgr70 {
	margin-right: 70px;
}
.mgr80 {
	margin-right: 80px;
}
.mgr90 {
	margin-right: 90px;
}

/* FLEX CONTAINER */
#wrapper .flex_container {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 50px 0;
}
#wrapper .flex_container.mb0 {
	margin-bottom: 0;
}
#wrapper .flex_container + .lead-text {
	padding-top: 0;
}
#wrapper .flex_container.two_one {
	justify-content: space-around;
}
#wrapper .two_one .flex_content {
	width: 35%;
	margin-bottom: 50px;
	flex-direction: column;
}
#wrapper .two_one .text_content {
	padding: 0;
	margin-top: 15px;
}

/* BUTTON */
.button a {
	border-radius: 999px;
	font-weight: bold;
	width: auto;
	height: 100%;
	color: #fff;
	display: flex;
	cursor: pointer;
	text-decoration: none;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: #969494;
	flex-direction: column;
	width: 600px;
	margin: 30px auto;
	line-height: 1em;
	padding: 15px 0 10px;
	font-size: 18.4px;
	max-width: 100%;
}
#wrapper .vt_fix .button a .f_big {
	font-size: 170%;
}

/* LIST */
.list01:not(:last-child) {
	margin-bottom: 30px;
}
.list01 li {
	display: block;
	padding-left: 15px;
	margin-bottom: 10px;
	position: relative;
	font-size: 18.4px;
}
.list01 li::before {
	background: #3879d9;
	width: 8px;
	height: 8px;
	position: absolute;
	top: 10px;
	left: 0;
	content: '';
	border-radius: 50%;
}

.list_dot {
}
.list_dot li {
	display: block;
	padding-left: 10px;
	margin-bottom: 10px;
	position: relative;
	font-size: 18.4px;
}
.list_dot li:not(:last-child) {
	margin-bottom: 10px;
}
.list_dot li::before {
	background: #333;
	width: 4px;
	height: 4px;
	position: absolute;
	top: 11px;
	left: 0;
	content: '';
	border-radius: 50%;
}

.list_numb {
	padding-left: 20px;
}
.list_numb li {
	list-style: decimal;
	font-size: 18.4px;
	margin-bottom: 10px;
}

.list_3img {
	display: flex;
	flex-wrap: wrap;
	margin-top: 20px;
}
.list_3img li {
	width: 32%;
	margin: 0 2% 20px 0;
}
.list_3img li:nth-child(3n + 3) {
	margin-right: 0;
}

/* TABLE */
.tb_fix {
	table-layout: fixed;
}
#wrapper table.td_top td {
	vertical-align: top;
}
#wrapper table.tb_none td {
	border: none;
	padding: 5px 0;
}

/* FLEX CONTENT */
.flex_4col {
	display: flex;
	flex-wrap: wrap;
}
.flex_4col li {
	width: calc((100% - 60px) / 4);
	margin: 0 20px 20px 0;
	font-size: 18.4px;
}
.flex_4col li:nth-child(4n + 4) {
	margin-right: 0;
}

.flex_3col {
	display: flex;
	flex-wrap: wrap;
}
.flex_3col li {
	width: calc((100% - 40px) / 3);
	margin: 0 20px 20px 0;
	font-size: 18.4px;
}
.flex_3col li:nth-child(3n + 3) {
	margin-right: 0;
}

.flex_2col {
	display: flex;
	flex-wrap: wrap;
}
.flex_2col li {
	width: calc((100% - 20px) / 2);
	margin: 0 20px 40px 0;
	font-size: 18.4px;
}
.flex_2col li:nth-child(2n + 2) {
	margin-right: 0;
}

#wrapper .vt_fix .bg_org {
	padding: 10px 15px;
	color: #fff;
	font-weight: bold;
	background: #e46c0a;
	border-radius: 10px;
	box-sizing: border-box;
}

/* FAQ LIST */
.faq:not(:last-child) {
	margin-bottom: 30px;
}
.faq dl {
	border-bottom: 1px dotted #ccc;
	margin-bottom: 20px;
	padding-bottom: 20px;
}
.faq dl:last-child {
	margin-bottom: 0;
}
.faq dt {
	position: relative;
	font-weight: bold;
	margin-bottom: 20px;
	display: flex;
	align-items: flex-start;
	color: red;
	font-size: 18.4px;
}
.faq dt span,
.faq dd span {
	width: 20px;
	height: 20px;
	font-weight: bold;
	text-align: center;
	line-height: 1em;
	flex-shrink: 0;
	color: red;
	font-size: 150%;
	flex-shrink: 0;
	margin-right: 15px;
}
.faq dd {
	position: relative;
	display: flex;
	align-items: flex-start;
}
.faq dd span {
	color: #297bc4;
}
#wrapper .vt_fix .faq dd .lead-text {
	padding-top: 0;
}

/* FRAME */
.frame01 {
	border-radius: 10px;
	border: 2px solid #02813e;
	max-width: 80%;
	margin: 30px auto 0;
	background: #dfeab0;
	padding: 10px 15px 20px;
}
.sp440 {
	display: none;
}

.text_indent {
	display: flex;
}
.text_indent span {
	flex-shrink: 0;
}

@media screen and (min-width: 769px) {
	.sp {
		display: none;
	}
	#wrapper .howto-2col.start {
		align-items: flex-start;
	}
	#wrapper .howto-2col.img_r {
		flex-direction: row-reverse;
	}
	#wrapper .howto-2col.img_r .imgbox-01 {
		padding: 10px 0px 0px 20px;
		text-align: right;
	}
	#wrapper .howto-2col.big .imgbox-01 {
		width: 580px;
	}
	#wrapper img.auto {
		width: auto;
		max-width: 100%;
	}

	#wrapper .flex_container.col_3 {
		justify-content: flex-start;
	}
	#wrapper .flex_container.col_3 .flex_content {
		width: 32%;
		margin-right: 2%;
	}
	#wrapper .flex_container.col_3 .flex_content:nth-child(3n + 3) {
		margin-right: 0;
	}

	#wrapper .howto-2col.min .txtbox-01 {
		width: 80%;
	}
	#wrapper .howto-2col.min .imgbox-01 {
		width: 20%;
	}

	#wrapper .vt_fix .bg_org.mh {
		min-height: 75px;
	}
}

@media screen and (max-width: 768px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	#wrapper .left_sp {
		text-align: left;
	}
	#wrapper .tab-menu-nav .fs-medium {
		padding: 0.5rem 1.75rem 0.5rem 1.25rem;
	}
	#wrapper .cus_ttl4 {
		font-size: 18.4px.;
	}
	#wrapper .howto-2col .imgbox-01 {
		margin-bottom: 10px;
	}
	#wrapper .banner_w50 {
		width: 100%;
	}
	#wrapper .feature-hdg1 .sub_title-secondary {
		margin-top: 10px;
	}
	#wrapper table th,
	#wrapper table td {
		font-size: 15.4px;
	}

	.button a {
		font-size: 15.4px;
	}
	#wrapper .vt_fix .button a .f_big {
		margin-top: 10px;
	}

	/* FLEX CONTAINER */
	#wrapper .flex_container {
		margin: 30px 0;
	}
	#wrapper .two_one .flex_content {
		width: 90%;
		margin-bottom: 30px;
	}
	#wrapper .full .flex_content {
		width: 100%;
		text-align: center;
	}

	#wrapper .box_ytb_txt {
		flex-direction: column;
	}
	#wrapper .box_ytb_txt .box_ytb {
		width: 100%;
		margin: 0 0 5px;
	}

	/* LIST */
	.list01:not(:last-child) {
		margin-bottom: 20px;
	}
	.list01 li,
	.list_dot li,
	.list_numb li {
		font-size: 15.2px;
	}
	.list01 li::before {
		width: 6px;
		height: 6px;
		top: 8px;
	}
	.lead-text + .faq {
		margin-top: 30px;
	}

	.list_dot li::before {
		top: 10px;
	}
	.faq dt {
		font-size: 15.2px;
	}

	/* TABLE */
	#wrapper .tb_scroll {
		overflow: scroll;
	}
	#wrapper .tb_scroll:not(:last-child) {
		margin-bottom: 20px;
	}
	#wrapper .tb_scroll .box_scroll,
	#wrapper .tb_scroll table {
		width: 768px;
	}
	#wrapper .tb_note {
		color: #999;
		font-size: 75%;
		margin-bottom: 10px;
	}

	/* FLEX CONTENT */
	.flex_4col li {
		width: calc((100% - 20px) / 2);
		margin: 0 20px 20px 0;
		font-size: 15.2px;
	}
	.flex_4col li:nth-child(4n + 4) {
		margin-right: 20px;
	}
	.flex_4col li:nth-child(2n + 2) {
		margin-right: 0;
	}
	.flex_2col li {
		font-size: 15.2px;
	}

	/* FAQ LIST */
	.faq:not(:last-child) {
		margin-bottom: 10px;
	}
	.faq dt {
		margin-bottom: 15px;
	}
	.faq dt span,
	.faq dd span {
		margin-right: 5px;
		font-size: 135%;
	}

	/* FRAME */
	.frame01 {
		width: 100%;
		text-align: left;
		max-width: 100%;
		box-sizing: border-box;
		padding: 5px 15px 15px;
	}

	/* TABLE */
	#wrapper table.tb_block tr {
		flex-direction: column;
		display: flex;
	}
	#wrapper table.tb_block th {
		width: 100%;
		border-bottom: none;
		box-sizing: border-box;
	}
	#wrapper table.tb_block td {
		width: 100%;
		box-sizing: border-box;
		border-bottom: none;
	}
	#wrapper table.tb_block tr:last-child td:last-child {
		border-bottom: none;
		border-bottom: 1px solid #333;
	}
}

@media screen and (max-width: 480px) {
	.sp440 {
		display: block;
	}
	#wrapper .feature-hdg1.big .sub_title {
		font-size: 8vw;
	}
	#wrapper .feature-hdg1.big_sp .sub_title {
		width: 90%;
		font-size: 8vw;
	}
	#wrapper .tab-menu-nav .small_sp {
		font-size: 0.9em;
	}
	#wrapper .tab-menu-nav .fs-small,
	#wrapper .tab-menu-nav .fs-medium {
		padding: 0.5rem 1.5rem 0.5rem 0.5rem;
	}
	#wrapper .list_brn {
		flex-wrap: wrap;
	}
	#wrapper .list_brn p {
		width: 100%;
	}

	.flex_2col li,
	.flex_3col li {
		width: 100%;
		margin: 0 0 20px;
	}
	.flex_2col li:last-child,
	.flex_3col li:last-child {
		margin-bottom: 0;
	}
	#wrapper .vt_fix .flex_2col li img,
	#wrapper .vt_fix .flex_3col li img {
		width: 100%;
		margin-bottom: 5px;
	}
}

#wrapper .relation-box {
	background-color: #edecec;
	margin-top: 40px;
	padding: 20px 20px;
	min-width: 400px;
	width: fit-content;
	box-sizing: border-box;
}
@media screen and (max-width: 767px) {
	#wrapper .relation-box {
		min-width: auto;
		width: 100%;
		margin-top: 30px;
	}
}

#wrapper .relation-box__heading {
	font-size: 1.2rem;
	font-weight: bold;
	margin: 0;
	margin-bottom: 5px;
}
@media screen and (max-width: 767px) {
	#wrapper .relation-box__heading {
		font-size: 1.05rem;
	}
}
#wrapper .relation-box p {
	padding: 0;
	margin-bottom: 10px;
}
#wrapper .relation-box p:last-child {
	margin-bottom: 0;
}
