html{ -webkit-text-size-adjust:none; margin:0 auto; padding:0;}
body{ margin:0;}
.clear{ clear:both; height:0;}
.center{ text-align:center;}
img{ border:0; vertical-align:bottom; max-width: 100%; height: auto;}
ul, ol{ margin:0; padding:0; list-style:none;}
p{ margin:0;}
:root{
    --black: #333333;
    --blue: #2f93f3;
    --red: #f03333;
    --pink: #ec9d9c;
    --gray: #999999;
    --lightgray: #e5e9eb;
    --base-font-color: #333333;
    --content-width: 1220px;
    --small-content-width: 1196px;
    --small-content-width-sp: calc(100% - var(--comp-60) - var(--comp-60));
    --content-padding: 0 12px;

    --comp-250: 33.7837837837837vw;
    --comp-230: 31.081081081081vw;
    --comp-220: 29.7297297297297vw;
    --comp-210: 28.3783783783783vw;
    --comp-200: 27.027027027027vw;
    --comp-195: 26.3513513513513vw;
    --comp-190: 25.6756756756756vw;
    --comp-185: 25vw;
    --comp-180: 24.3243243243243vw;
    --comp-175: 23.6486486486486vw;
    --comp-170: 22.9729729729729vw;
    --comp-165: 22.2972972972972vw;
    --comp-160: 21.6216216216216vw;
    --comp-155: 20.9459459459459vw;
    --comp-150: 20.2702702702702vw;
    --comp-145: 19.5945945945945vw;
    --comp-140: 18.9189189189189vw;
    --comp-135: 18.2432432432432vw;
    --comp-130: 17.5675675675675vw;
    --comp-125: 16.8918918918918vw;
    --comp-120: 16.2162162162162vw;
    --comp-115: 15.5405405405405vw;
    --comp-110: 14.8648648648648vw;
    --comp-105: 14.1891891891891vw;
    --comp-100: 13.5135135135135vw;
    --comp-95: 12.83783783783783vw;
    --comp-90: 12.1621621621621vw;
    --comp-85: 11.48648648648648vw;
    --comp-80: 10.8108108108108vw;
    --comp-75: 10.13513513513513vw;
    --comp-70: 9.459459459459459vw;
    --comp-65: 8.738738738738738vw;
    --comp-60: 8.108108108108108vw;
    --comp-55: 7.432432432432432vw;
    --comp-50: 6.756756756756756vw;
    --comp-45: 6.081081081081081vw;
    --comp-40: 5.405405405405405vw;
    --comp-35: 4.729729729729729vw;
    --comp-30: 4.054054054054054vw;
    --comp-25: 3.378378378378378vw;
    --comp-20: 2.702702702702702vw;
    --comp-15: 2.027027027027027vw;
    --comp-10: 1.351351351351351vw;
    --comp-5: 0.6756756756756756vw;

    --comp-88: 11.8918918918918vw;
    --comp-66: 8.91891891891891vw;
    --comp-48: 6.48648648648648vw;
    --comp-46: 6.21621621621621vw;
    --comp-42: 5.67567567567567vw;
    --comp-36: 4.86486486486486vw;
    --comp-34: 4.59459459459459vw;
    --comp-32: 4.32432432432432vw;
    --comp-28: 3.78378378378378vw;
    --comp-27: 3.64864864864865vw;
    --comp-26: 3.51351351351351vw;
    --comp-24: 3.24324324324324vw;
    --comp-22: 2.97297297297297vw;
    --comp-20: 2.70270270270270vw;
    --comp-18: 2.43243243243243vw;
    --comp-16: 2.16216216216216vw;
    --comp-14: 1.89189189189189vw;
    --comp-12: 1.62162162162162vw;
    --comp-8: 1.081081081081081vw;
    --comp-6: 0.81081081081081vw;
}
/*---------------------------------------------
 CONTAINER/TOP
---------------------------------------------*/

#container{ font-family: 'Noto Sans JP', sans-serif; padding-bottom: 80px; width: 100%; margin: 0 auto; color: var(--black); font-feature-settings: "palt"; min-width: 1220px;}
#container *{ font-family: 'Noto Sans JP', sans-serif;}
#container p { font-size: 16px; line-height: 1.9; letter-spacing: 0.1em;}
#container p.large{ font-size: 18px; line-height: 1.9; letter-spacing: 0.1em; font-weight: 500;}
/*#container p:not([class]){ font-size: 16px; line-height: 1.9; letter-spacing: 0.1em;}
#container p:not([class]) .icon{ aspect-ratio: 1 / 1; width: 1.4em; display: inline-block; vertical-align: middle; line-height: 1;}
#container p:not([class]) .icon img{ object-fit: contain; width: 100%; height: 100%;}
p:not([class]) a{ color: var(--black); transition: all ease 0.3s; text-decoration: underline;}*/
#container .indent01{ text-indent: -1em !important; padding-left: 1em !important; display: inline-block !important; line-height: inherit !important; font-size: inherit !important;}
#container .u-caution{ font-size: 12px; line-height: 1.6; color: #666666; margin: 80px auto 0; width: var(--content-width); padding: var(--content-padding); box-sizing: border-box; letter-spacing: 0;}
#container .red{ color: var(--red) !important;}
#container p b{ font-weight: 500;}

/*@media (any-hover: hover) {
p:not([class]) a:hover{ opacity: 0.7;}
}*/

@media screen and (width > 750px){
.sp{ display: none !important;}
*{ scroll-margin-top: 10px; }
.wrapTabBox * { scroll-margin-top: 120px; }
}

@media screen and (width <= 749px){
:root{
    --content-width: 100%;
}
#container{ min-width: 0;}
.pc{ display: none !important;}
*{ scroll-margin-top: 55px; }
.wrapTabBox *{ scroll-margin-top: calc(55px + var(--comp-200)); }

#container{ width: 100%; padding-bottom: var(--comp-100);}
/*#container p:not([class]){ font-size: var(--comp-24); }*/
#container p.large{ font-size: var(--comp-26); max-width: var(--small-content-width-sp); margin-left: auto; margin-right: auto;}
#container .u-caution{ font-size: var(--comp-20); margin: var(--comp-80) auto 0; padding: 0; width: calc(100% - var(--comp-60) - var(--comp-60));}
}

/*-- breadcrumbs --*/
#breadcrumbs{ width: var(--content-width); box-sizing: border-box; padding: 16px 12px 0; margin: 0 auto 50px;}
#breadcrumbs > ol{ list-style: none; display: flex; line-height: 1.8;}
#breadcrumbs > ol li{ display: inline; align-items: center; font-size: 12px; margin-right: 15px;}
#breadcrumbs > ol li:has(> a)::after{ content: ""; display: inline-block; aspect-ratio: 1 /1; width: 6px; border-top: 1px solid var(--black); border-right: 1px solid var(--black); vertical-align: middle; transform: rotate(45deg);}
#breadcrumbs > ol li a{ color: var(--black); text-decoration: none; margin-right: 15px; transition: all ease 0.3s;}

@media (any-hover: hover) {
#breadcrumbs > ol li a:hover{ opacity: 0.7;}
}

@media screen and (width <= 749px){
#breadcrumbs{ width: var(--content-width); padding: var(--comp-30) var(--comp-40) 0; margin: 0 auto var(--comp-80);}
#breadcrumbs > ol li{ font-size: var(--comp-20); margin-right: var(--comp-20);}
#breadcrumbs > ol li:has(> a)::after{ width: var(--comp-10);}
#breadcrumbs > ol li a{ margin-right: var(--comp-20);}
}

/*-- content --*/
hgroup.mainTtlGroup{ margin-bottom: 80px;}
hgroup.mainTtlGroup:has( > .simplePageTtl:only-child){ margin-bottom: 100px;}
hgroup.mainTtlGroup > *{ width: var(--content-width); padding: var(--content-padding); margin-left: auto; margin-right: auto;}
hgroup.mainTtlGroup .lead{ margin: 30px auto 0; font-size: 18px; text-align: center; line-height: 1.75; box-sizing: border-box; letter-spacing: 0.05em;}
.simplePageTtl{ margin: 0 auto; color: var(--black); box-sizing: border-box; text-align: center; font-weight: 500; font-size: 40px; letter-spacing: 0.1em; padding-bottom: 15px; position: relative; line-height: 1.8; z-index: 1;}
.simplePageTtl::after{ content: ""; display: block; width: 360px; height: 24px; margin: 0 auto; background-color: #eee; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%) skewX(-15deg); z-index: -1;}
.simplePageTtl + h2{ display: flex; justify-content: center; align-items: center; font-size: 32px; letter-spacing: 0.2em; font-weight: 500; gap: 20px; margin: 30px auto 0;}
.simplePageTtl + h2 .icon{ display: block; aspect-ratio: 66 / 57; width: 66px;}
.simplePageTtl + h2 .icon img{ object-fit: contain; width: 100%; height: 100%;}
.simplePageTtl + h2 .text{ max-width: calc(100% - 20px - 66px); line-height: 1.75;}
#contents > .lead{ width: var(--small-content-width); margin: 0 auto 60px; box-sizing: border-box; font-size: 16px; line-height: 1.75; }
.contentCaution{ font-size: 16px; margin-top: 20px; max-width: var(--small-content-width); margin-right: auto; margin-left: auto;}
.contentCaution a{ color: var(--black); text-decoration: underline; transition: all ease 0.3s;}
.flexBox{ display: flex;}
.bgWhite{ background-color: #fff;}
.bgBlack{ background-color: var(--black);}
.bgWhite,
.bgBlack{ padding: 100px 0;}
.bgWhite:first-child,
.bgBlack:first-child{ padding-top: 0;}
.bgWhite > .inner,
.bgBlack > .inner{ padding: 0 12px; width: var(--content-width); margin: 0 auto; box-sizing: border-box;}
.minBgBlack,
.minBgWhite{ width: var(--content-width); padding: var(--content-padding); box-sizing: border-box; margin: 0 auto; }
.minBgBlack > .inner{ padding: 60px 108px 100px; box-sizing: border-box; background-color: var(--black);}
.minBgWhite > .inner{ padding: 100px 108px; box-sizing: border-box; background-color: #fff;}
.simpleTtl{ font-size: 24px; font-weight: 700; text-align: center; margin: 0 auto 40px; line-height: 1.8; width: 100%}
.bgBlack .inner > .simpleTtl,
.minBgBlack .inner > .simpleTtl{ color: #fff;}
.bgWhite .inner > .simpleTtl,
.minBgWhite .inner > .simpleTtl{ color: var(--black);}
.ta-right{ text-align: right !important;}

@media (any-hover: hover) {
.contentCaution a:hover{ opacity: 0.7;}
}

@media screen and (width <= 749px){
hgroup.mainTtlGroup > *{ width: 100%; padding: 0 var(--comp-60); margin-left: auto; margin-right: auto;}
hgroup.mainTtlGroup{ margin-bottom: var(--comp-100);}
hgroup.mainTtlGroup:has( > .simplePageTtl:only-child){ margin-bottom: var(--comp-80);}
hgroup.mainTtlGroup .lead{ margin: var(--comp-30) auto 0; font-size: var(--comp-27); text-align: center; box-sizing: border-box; line-height: 1.75;}
.simplePageTtl{ margin: 0 auto; padding: var(--content-padding); font-size: var(--comp-60); padding-bottom: var(--comp-20) !important; line-height: 1.5;}
.simplePageTtl::after{ content: ""; display: block; width: 27vw; height: max(12px, 0.81vw);}
.simplePageTtl + h2{ flex-wrap: wrap; font-size: var(--comp-48); gap: var(--comp-20); padding: var(--content-padding); box-sizing: border-box; margin: var(--comp-30) auto 0;}
.simplePageTtl + h2 .icon{ width: var(--comp-88);}
.simplePageTtl + h2 .text{ max-width: 100%; width: 100%; text-align: center; }
#contents > .lead{ width: 100%; margin: 0 auto var(--comp-60); font-size: var(--comp-24); padding: 0 var(--comp-60); }
.contentCaution{ font-size: var(--comp-24); max-width: var(--small-content-width-sp); margin-top: var(--comp-10);}
.flexBox{ display: flex;}
.bgWhite,
.bgBlack{ padding: var(--comp-100) 0;}
.bgWhite > .inner,
.bgBlack > .inner{ padding: 0; width: var(--content-width); margin: 0 auto; box-sizing: border-box;}
.minBgBlack,
.minBgWhite{ width: 100%; padding: 0; }
.minBgBlack > .inner{ padding: var(--comp-90) var(--comp-60) var(--comp-100); box-sizing: border-box; background-color: var(--black);}
.minBgWhite > .inner{ padding: var(--comp-100) var(--comp-60); box-sizing: border-box; background-color: #fff;}
.simpleTtl{ font-size: var(--comp-36); margin: 0 auto var(--comp-60);}
}

.cautionSection {
    border-top: 1px solid var(--lightgray);
	padding: 0 auto;
}
@media screen and (width <= 749px){
.cautionSection {margin-top: 60px;}
}

.sf-test a:link,
.sf-test a:visited{
	color: #005497;
	text-decoration: none;
	transition:all 0.2s;
}

.sf-test a:hover {
    opacity: .7;
    text-decoration: none;
}




/* -------------------------------------------------------
 basic parts
------------------------------------------------------- */

/* title
---------------------------------*/

.sf-test .wrap{ max-width: 1220px; width:96%; margin:0 auto; padding:0 auto;text-align:left;}
.sf-test .main_img{ max-width: 1220px; width: 100%;margin:0 auto 40px; padding: 0 auto;text-align:center;}
.sf-test .main_img img{ width: 100%; height: auto;}

@media (min-width: 600px) {
.sf-test .wrap{ width:90%; margin:0 auto; padding:0 auto;text-align:left;}
.sf-test .main_img{ margin:0px auto 20px; padding: 0 auto;text-align:center;width: 100%;}
.sf-test .main_img img{ width: 100%; height: auto;}
}


.toggleContents__close {
	text-align: right;
	margin-top: 10px;
	margin-bottom: -15px;
}

@media (min-width: 600px) {
	.toggleContents__close {
		margin-bottom: -15px;
		font-size: 1.2rem;
		cursor: pointer;
	}
}

.toggleContents__close::after {
	content: url(../images/icon-arrow001.svg);
	position: relative;
	top: 2px;
	width: 6px;
	height: 12px;
	display: inline-block;
	line-height: 100%;
	transform: rotate(270deg);
	cursor: pointer;
	margin-left: 5px;
}

@media (min-width: 600px) {
	.toggleContents__close::after {
		top: calc(50% - 12px);
		margin-left: 10px;
	}
}



/* link
---------------------------------*/
.link001,
a.link001 {
	display: inline-block;
}

.link001::before {
	font-family: "Font Awesome 5 Free";
	content: "\f0da";
	margin-right: 5px;
	color: rgba(255, 255, 255, .5);
	font-size: 1.3rem;
	font-weight: 600;
}

/* -------------------------------------------------------
 header
------------------------------------------------------- */
.Header {
	border-top: 1px solid #D30000;
	border-bottom: 1px solid #D30000;
	background: #374254;
}

@media (min-width: 600px) {
	.Header {
		border-top: none;
		width: 100%!important;
	}
}

.blockHeader {
	position: relative;
}

@media (min-width: 600px) {
	.headerLogo {
		width: 980px;
		margin-left: auto;
		margin-right: auto;
		position: relative;
	}
}

.blockHeaderImage {
	background: #202D40;
	border-top: 1px solid #D30000;
}

.blockHeaderImage img {
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.titleHead {
	text-align: center;
	font-weight: 600;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 1.8rem;
}

@media (min-width: 600px) {
	.titleHead {
		padding-top: 15px;
		padding-bottom: 15px;
		font-size: 2.8rem;
		padding-left: 0;
		line-height: 170%;
		text-align: left;
	}
}

.headerLogo__logo {
	width: 232px;
	position: absolute;
	bottom: -20px;
	left: 3px;
	background: rgba(255, 255, 255, .7);
	padding: 3px;
}

@media (min-width: 600px) {
	.headerLogo__logo {
		width: 339px;
		position: relative;
		top: 5px;
		left: 0;
		padding-left: 0;
		bottom: initial;
		padding: 5px;
		background: rgba(255, 255, 255, .6);
	}
}

.headerLogo__logo img {
	height: 40px;
	width: auto;
}

@media (min-width: 600px) {
	.headerLogo__logo img {
		height: 60px;
		width: auto;
		max-width: initial;
	}
	.headerLogo__logo img + img {
		margin-top: 0;
	}
}

/*table*/
.sf-test .wrap h3{font-size:24px;font-weight: 600;margin: 1em auto 0.5em;}

.sf-test .wrap table.sf_outline{ width:100%; margin:80px auto 120px; border:#b2b2b2 1px solid; border-collapse:collapse;}
.sf-test .wrap table.sf_outline th,
.sf-test .wrap table.sf_outline td { border:#b2b2b2 1px solid; vertical-align: middle;box-sizing: border-box;}
.sf-test .wrap table.sf_outline th { background-color: var(--lightgray); padding:15px 25px;width: 25%;line-height: 160%;font-weight:600; }
.sf-test .wrap table.sf_outline td { padding:15px 25px;line-height: 160%;}
.sf-test .wrap table.sf_outline td strong {font-weight: 600;}
.sf-test .wrap table.sf_outline td table.lounge {margin-top : 10px;margin-bottom: 10px;}
.lounge th,.lounge td { font-size: 0.9em; text-align:center;}
.lounge th p,.lounge td p{ margin: 0;}

@media (max-width: 768px) {
.sf-test .wrap table.sf_outline{ width:96%; margin:0px auto 30px; border-collapse:collapse; padding: 0 auto;border-bottom:#b2b2b2 1px solid;border-top: none;}
.sf-test .wrap table.sf_outline th,
.sf-test .wrap table.sf_outline td {display:block;
	border-right: none;   /* ← 右線を消す */
    border-left: none;    /* ← 左線も消す */
    border-bottom: none; /* 下線だけ残す */
	font-size: var(--comp-28); width: 100%; max-width: 100%;
}
.sf-test .wrap table.sf_outline th{ background-color: var(--lightgray); width: 100%;line-height: 150%;padding: var(--comp-25) var(--comp-30);}
.sf-test .wrap table.sf_outline td{ width: 100%;line-height: 150%;text-align:left;padding: var(--comp-25) var(--comp-30);}
.sf-test .wrap td table.lounge {width: 100%;border-collapse: collapse; margin-bottom: 10px;}
.sf-test .wrap td table.lounge tr {display:flex;justify-content: center;}
.sf-test .wrap td table.lounge th,
.sf-test .wrap td table.lounge td { font-size: 0.8em; text-align:center;width: 25%; letter-spacing: 0;border-left: none;vertical-align: middle!important;border:#b2b2b2 1px solid;}
.sf-test .wrap td table.lounge th > * ,
.sf-test .wrap td table.lounge td > * { display: flex;
    align-items: center; /* 縦中央 */
}
.sf-test .wrap td table.lounge td.close {background-color: #ccc;}


}

.grayBox {background-color: #eee; padding: 25px;}
.grayBox p.lead { font-size: 16px; letter-spacing: normal;}
@media screen and (width <= 749px){
.grayBox p.lead{ margin: var(--comp-30) auto 0; font-size: var(--comp-27); box-sizing: border-box; line-height: 1.75;}
}
/* -------------------------------------------------------
 utility
------------------------------------------------------- */
.u-textLeft:not(:root) {
	text-align: left;
}

.u-textCenter:not(:root) {
	text-align: center;
}

.u-textRight:not(:root) {
	text-align: right;
}

.u-textNormal:not(:root) {
	font-weight: 400;
}

.u-textBold:not(:root) {
	font-weight: 600;
}

.u-pc {
	display: none;
}

@media (min-width: 600px) {
	.u-sp {
		display: none;
	}
	
	.u-pc {
		display: block;
	}
}



p.mb1em{margin-bottom: 1em;}
p.mb2em{margin-bottom: 2em;}


/* -------------------------------------------------------
文字色
------------------------------------------------------- */

.red {color: #f00;}
.pink {color:#f6c;}


.Container a.mizuiro {color:#6cf;text-decoration: underline;}

/* -------------------------------------------------------
共通ヘッダーフッター対応
------------------------------------------------------- */

#suzukaHeaderWrap2016 ol,#suzukaHeaderWrap2016 ul,#suzukaHeaderWrap2016 li,#suzukaHeaderWrap2016 .logo {
    box-sizing: content-box;
}

#suzukaFooterWrap2016 #pageTop img {
    box-sizing: content-box;
}