@charset "UTF-8";

/* ==========================================================================
 * Font face
 * ========================================================================== */
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 100;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 200;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 300;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 400;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Bold");
	font-weight: bold;
}

/* ==========================================================================
 * Root
 * ========================================================================== */
*,
::before,
::after {
	background-repeat: no-repeat;
	box-sizing: border-box;
}
html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	font-size: 62.5%;
}
body {
	margin: 0;
	font-family: "Noto Serif JP","Yu Mincho", "sans-serif", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", "Osaka";
	font-size: 1.6em;
	font-size: 1.6rem;
	line-height: 1.5;
	background-color: #fff;
}

/* ==========================================================================
 * HTML5 display definitions
 * ========================================================================== */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
	display: block;
}
audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}
audio:not([controls]) {
	display: none;
	height: 0;
}

/* ==========================================================================
 * Anchor
 * ========================================================================== */
a:link,
a:visited {
	background-color: transparent;
	color: #4f7aac;
	text-decoration: none;
}
a:active,
a:hover {
	outline: 0;
	text-decoration: underline;
}

/* ==========================================================================
 * Embedded
 * ========================================================================== */
img {
	max-width: 100%;
	height: auto;
	border: 0;
	vertical-align: bottom;
}
svg:not(:root) {
	overflow: hidden;
}

/* ==========================================================================
 * Grouping
 * ========================================================================== */
figure {
	margin: 0;
}
hr {
	box-sizing: content-box;
	height: 0;
	border: none;
	border-top: 1px solid #bbb;
}
dd {
	margin-left: 0;
}

/* ==========================================================================
 * Float
 * ========================================================================== */
.clear {
	clear: both;
}
.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}
.clearfix:after {
	clear: both;
}

/* ==========================================================================
 * List
 * ========================================================================== */
ul,
ol {
	padding: 0;
}
ul {
	margin: 0;
	list-style: none;
}
ul.list-disc {
	margin-left: 1.55em;
	list-style: disc;
}
ul.list-annotation {
	margin-left: 1.3em;
}
ul.list-annotation li::before {
	margin-left: -1.3em;
	content: "※\0020";
}
ol {
	margin-left: 1.3em;
}
ol.list-annotation {
	margin-left: 2em;
	padding: 0;
	counter-reset: number;
	list-style: none;
}
ol.list-annotation li::before {
	margin-left: -2em;
	counter-increment: number;
	content: "※"counter(number)"\0020";
}
ul.list-disc li + li,
ul.list-annotation li + li,
ol li + li {
	margin-top: 8px;
}

/* ==========================================================================
 * Text
 * ========================================================================== */
b,
strong {
	font-weight: bold;
}
mark {
	background: #ff0;
	color: #000;
}
small,
.txt-small{
	font-size: 75%;
	display: block;
	color: #7a7a7a;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
address {
	font-style: normal;
}
h1,
.h1 {
	font-size: 3.2rem;
	line-height: 1.2;
	margin: 0;
}
h2,
.h2 {
	font-size: 5rem;
	line-height: 1.2;
	margin: 0;
	font-weight: 500;
}
h3,
.h3 {
	font-size: 1.8rem;
	line-height: 1.2;
	margin: 0;
}
h4,
.h4 {
	font-size: 1.6rem;
	line-height: 1.2;
	margin: 0;
}
p {
	margin: 0;
}
p + p {
	margin-top: .5em;
	margin-bottom: 0;
}
.txt-left {
	text-align: left;
}
.txt-center {
	text-align: center;
}
.txt-right {
	text-align: right;
}
.txt-unbold {
	font-weight: normal;
}
.txt-bold {
	font-weight: bold;
}
.txt-emphasis {
	color: #e74c3c;
}
.txt-notes {
	color: #7f8c8d;
}

.blue-txt {
	color: #0e3552;
}
.yellow-txt {
	color: #fecb7c;
}
.tight {
	letter-spacing: -0.23em;
}

.indent {
  display: block;          /* ブロック要素にする必要あり */
  text-indent: 1em;        /* 1文字分字下げ（お好みで調整） */
  line-height: 1.6;        /* 読みやすさのために設定推奨 */
}

.txt18 {
	font-size: 1.8rem;
}
.txt25 {
	font-size: 2.5rem;
}

.ttl24 {
	font-size: 2.4rem;
}
.ttl30 {
	font-size: 3rem;
}
.ttl32 {
	font-size: 3.2rem;
}
.ttl40 {
	font-size: 4rem;
}
.ttl64 {
	font-size: 6.4rem;
}
.ttl72 {
	font-size: 7.2rem;
}
.ttl80 {
	font-size: 8rem;
}
.txt__ul {
	display: inline-block;
	border-bottom: 1px solid #fecb7c;  /* 下線の色・太さ */
	padding-bottom: 0px;              /* 文字との距離調整 */
}
@media screen and (max-width: 640px) {
	h2,
	.h2 {
		font-size: 10vw;
	}
	.txt18 {
		font-size: 1.6rem;
	}
	.ttl24 {
		font-size: 1.6rem;
	}
	.ttl30 {
		font-size: 7vw;
	}
	.ttl32 {
		font-size: 2.4rem;
	}
	.ttl40 {
		font-size: 7vw;
	}
	.ttl80 {
		font-size: 3.8rem;
	}
	small,
	.txt-small{
		font-size: 60%;
	}
}

/* ==========================================================================
 * Table
 * ========================================================================== */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
td,
th {
	padding: 0;
}

/* ==========================================================================
 * Form
 * ========================================================================== */
button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
	border: 1px solid #999;
}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
	width: 100%;
	padding: 5px;
}
button {
	overflow: visible;
}
button,
select {
	text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}
button[disabled],
html input[disabled] {
	cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}
input {
	line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}
input[type="search"] {
	-webkit-appearance: textfield;
	box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}
textarea {
	overflow: auto;
}

/* ==========================================================================
 * Spacing
 * ========================================================================== */
.margin-none  {margin:           0px !important;}
.padding-none {padding:          0px !important;}

.margin-T0    {margin-top:       0px !important;}
.margin-T5    {margin-top:       5px !important;}
.margin-T10   {margin-top:      10px !important;}
.margin-T15   {margin-top:      15px !important;}
.margin-T20   {margin-top:      20px !important;}
.margin-T25   {margin-top:      25px !important;}
.margin-T30   {margin-top:      30px !important;}
.margin-T35   {margin-top:      35px !important;}
.margin-T40   {margin-top:      40px !important;}
.margin-T45   {margin-top:      45px !important;}
.margin-T50   {margin-top:      50px !important;}
.margin-T60   {margin-top:      60px !important;}
.margin-T70   {margin-top:      70px !important;}
.margin-T80   {margin-top:      80px !important;}
.margin-T90   {margin-top:      90px !important;}
.margin-T100  {margin-top:     100px !important;}

.margin-R0    {margin-right:     0px !important;}
.margin-R5    {margin-right:     5px !important;}
.margin-R10   {margin-right:    10px !important;}
.margin-R15   {margin-right:    15px !important;}
.margin-R20   {margin-right:    20px !important;}

.margin-B0    {margin-bottom:    0px !important;}
.margin-B5    {margin-bottom:    5px !important;}
.margin-B10   {margin-bottom:   10px !important;}
.margin-B15   {margin-bottom:   15px !important;}
.margin-B20   {margin-bottom:   20px !important;}

.margin-L0    {margin-left:      0px !important;}
.margin-L5    {margin-left:      5px !important;}
.margin-L10   {margin-left:     10px !important;}
.margin-L15   {margin-left:     15px !important;}
.margin-L20   {margin-left:     20px !important;}

.padding-T0   {padding-top:      0px !important;}
.padding-T5   {padding-top:      5px !important;}
.padding-T10  {padding-top:     10px !important;}
.padding-T15  {padding-top:     15px !important;}
.padding-T20  {padding-top:     20px !important;}
.padding-T25  {padding-top:     25px !important;}
.padding-T30  {padding-top:     30px !important;}
.padding-T35  {padding-top:     35px !important;}
.padding-T40  {padding-top:     40px !important;}
.padding-T45  {padding-top:     45px !important;}
.padding-T50  {padding-top:     50px !important;}
.padding-T60  {padding-top:     60px !important;}
.padding-T70  {padding-top:     70px !important;}
.padding-T80  {padding-top:     80px !important;}
.padding-T90  {padding-top:     90px !important;}
.padding-T100 {padding-top:    100px !important;}

.padding-R0   {padding-right:    0px !important;}
.padding-R5   {padding-right:    5px !important;}
.padding-R10  {padding-right:   10px !important;}
.padding-R15  {padding-right:   15px !important;}
.padding-R20  {padding-right:   20px !important;}

.padding-B0   {padding-bottom:   0px !important;}
.padding-B5   {padding-bottom:   5px !important;}
.padding-B10  {padding-bottom:  10px !important;}
.padding-B15  {padding-bottom:  15px !important;}
.padding-B20  {padding-bottom:  20px !important;}

.padding-L0   {padding-left:     0px !important;}
.padding-L5   {padding-left:     5px !important;}
.padding-L10  {padding-left:    10px !important;}
.padding-L15  {padding-left:    15px !important;}
.padding-L20  {padding-left:    20px !important;}

/* ==========================================================================
 * Common
 * ========================================================================== */
#page-container {
	max-width: 2000px;
	min-width: 1060px;
	margin: 0 auto;
}
.inner-width {
	width: 920px;
	margin-right: auto;
	margin-left:  auto;
}

@media screen and (max-width: 640px) {
	.inner-width {
		width: 90%;
        margin-right: auto;
        margin-left: auto;
	}
	.visible-pc {
		display: none !important;
	}
	#page-container {
        max-width: 640px;
        overflow: hidden;
        min-width: unset;
    }
}
@media screen and (min-width: 641px) {
	.visible-sp {
		display: none !important;
	}
}

/*-------------------- Back to Top --------------------*/
a.backtotop {
	position: fixed;
	bottom: 30px;
	right: 5%;
	width: 40px;
	height: 40px;
	padding: 38px 0 0;
	background-color: #ccc;
	color: #fff;
	text-align: center;
	font-size: 14px;
	cursor: pointer;
	opacity: .5;
	border-radius: 50%;
}
a.backtotop::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 10px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 10px 17.3px 10px;
	border-color: transparent transparent #ffffff transparent;
}

/* ==========================================================================
 * main
 * ========================================================================== */
main {
	overflow-x: hidden;
}
picture {
	display: block;
}


/* ==========================================================================
 * Header
 * ========================================================================== */
header {
	font-family: "Noto Sans JP";
	position: fixed;
    top: 0;
    left: 0;
	z-index: 998;
    width: 100%;
	padding: 5px 0;
	transition-duration: .5s;
	transform: translateY(0px);
	background-color: rgba(255, 255, 255, 0.7);
	filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.2));
}
.headerColorScroll {
	background-color: #fff;
	opacity: 1;
	transform: translateY(0px);
}
.gnavi {
	font-size: 1.6rem;
	padding: 9px 0;
}
.gnavi__list {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.gnavi__list li {
	align-items: center;
	display: flex;
	position: relative;
}
.gnavi__list li:nth-child(2) {
	padding-left: 100px;
}
.gnavi__list a {
	display: block;
	font-weight: 500;
	color: #0e3552;
}
.header__cta--btn {
	cursor: pointer;
	width: fit-content;
}
.header__cta--btn:hover img {
    transform: scale(1.02);
}
.circle {
  width: 4px;
  height: 4px;
  background-color: #0e3552;
  border-radius: 50%;
}

@media screen and (max-width: 640px) {
	.gnavi {
		padding: 6px 0;
	}
	.header__logo--sp img {
		width: 30%;
		display: block;
	}
	/* hamburger menu */
	.menu__btn {
		align-items: center;
		display: flex;
		justify-content: center;
		position: fixed;
		top: 3px;
		right: 20px;
		padding: 20px;
		z-index: 9999;
		width: 30px;
	}
	.menu__btn span,
	.menu__btn span:before,
	.menu__btn span:after {
		content: '';
		background: #0e3552;
		border-radius: 3px;
		display: block;
		height: 3px;
		position: absolute;
		width: 25px;
	}
	.menu__btn span:before {
		bottom: 8px;
	}
	.menu__btn span:after {
		top: 8px;
	}
	#menu__btn--check:checked ~ .menu__btn span {
		background-color: rgba(255, 255, 255, 0);
	}
	#menu__btn--check:checked ~ .menu__btn span::before {
		bottom: 0;
		transform: rotate(45deg);
	}
	#menu__btn--check:checked ~ .menu__btn span::after {
		top: 0;
		transform: rotate(-45deg);
	}
	#menu__btn--check {
		display: none;
	}
	.gnavi__hamburger-menu {
		background: #fff;
		height: 100%;
		position: fixed;
		top: 0;
		left: 100%;
		z-index: 9998;
		transition: all 0.5s;
		width: 100%;
	}
	#menu__btn--check:checked ~ .gnavi__hamburger-menu {
		left: 0;
	}
	.gnavi__hamburger-menu ul {
		padding: 70px 10px 100%;
		background-color: #fff;
	}
	.gnavi__hamburger-menu ul li {
		border-bottom: solid 1px #0e3552;
		list-style: none;
		padding: 0 0 0 3%;
		width: 100%;
	}
	.gnavi__hamburger-menu ul li a {
		box-sizing: border-box;
		color: #000;
		display: block;
		font-size: 15px;
		padding: 18px 15px 15px 0;
		position: relative;
		text-decoration: none;
		width: 100%;
		transition: color 0.3s;
	}
	.gnavi__hamburger-menu ul li a::before {
		border-top: solid 2px #000;
		border-right: solid 2px #000;
		content: "";
		height: 7px;
		transform: rotate(45deg);
		position: absolute;
		right: 11px;
		top: 26px;
		width: 7px;
	}
	.gnavi__hamburger-menu ul li:last-child {
		border-bottom: none;
		margin: 20px 0 0;
	}
	.gnavi__hamburger-menu ul li:last-child a::before {
		border-top: none;
		border-right: none;
		display: none;
	}
	.navi__link {
		background: none;
	}
	.navi__link a {
		color: #000 !important;
	}
	.navi__link a::before {
		border-top: solid 2px #000 !important;
		border-right: solid 2px #000 !important;
	}
	.main__cta, .navi__link img {
		width: 100%;
	}
	/* /hamburger menu */
}

/* ==========================================================================
 * main
 * ========================================================================== */
main {
	overflow-x: hidden;
}
picture {
	display: block;
}

/* ==========================================================================
 * keyVisual
 * ========================================================================== */
.keyVisual {
	background: url(../images/pc/fv_bg.jpg) no-repeat center center / cover;
	height: 650px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.keyVisual__copy {
	text-align: center;
	margin-top: 135px;
}
.keyVisual__award {
	background-color: #fff;
	padding: 40px 0;
}
.keyVisual__award small {
	display: block;
	margin-top: 20px;
	color: #7a7a7a;
}

@media screen and (max-width: 640px) {
	.keyVisual {
		background: url("../images/sp/fv_bg@2x.jpg") no-repeat center center / cover;
		height: 129vw;;
		width: 100%;
		padding: 0;
	}
	.keyVisual__copy {
		margin-top: -25%;
	}
	.keyVisual__award {
		background-color: #fff;
		padding: 8% 0;
	}
	.keyVisual__award small {
		display: block;
		margin-top: 4%;
		color: #7a7a7a;
	}
}


/* ==========================================================================
 * Cta
 * ========================================================================== */
.cta {
	background: linear-gradient(60deg, #ebfafe, #c8e9fe);
	padding: 80px 0;
}
.cta__flex {
	display: flex;
	justify-content: space-between;
}
.cta__ttl {
	margin-bottom: 5px;
}
.cta__btn--dl, .cta__btn--sr {
	cursor: pointer;
	width: fit-content;
	margin: 0 auto;
	border-radius: 55px;
	box-shadow: 3px 4px 4px rgba(50, 50, 50, 0.2);
}

.cta__btn--dl:hover img {
    transform: scale(1.02);
}
.cta__btn--sr:hover img {
    transform: scale(1.02);
}

@media screen and (max-width: 640px) {
	.cta {
		background: linear-gradient(60deg, #ebfafe, #c8e9fe);
		padding: 15% 0;
	}
	.cta__flex {
		display: block;
		justify-content: space-between;
	}
	.cta__ttl {
		margin-bottom: 2%;
	}
	.cta__dl {
		margin-bottom: 10%;
	}
	.cta__btn--dl, .cta__btn--sr {
		cursor: pointer;
		width: fit-content;
		margin: 0 auto;
	}
	.cta__btn--dl:hover img {
		transform: scale(1.02);
	}
	.cta__btn--sr:hover img {
		transform: scale(1.02);
	}
}

/* ==========================================================================
 * Anxiety
 * ========================================================================== */
.anxiety {
	background: url(../images/pc/anxiety_bg.jpg) no-repeat center center / cover;
	padding: 80px 0;
	color: #fff;
	text-align: center;
}
.anxiety__map {
	margin-top: 60px;
}
.anxiety__even {
	background-color: #fff;
	padding: 40px 0;
	text-align: center;
}
.anxiety__damage {
	background: url(../images/pc/anxiety_bg_crack.jpg) no-repeat center center / cover;
	padding: 40px 0;
	color: #fff;
	text-align: center;
}

@media screen and (max-width: 640px) {
	.anxiety {
		background: url("../images/sp/anxiety_bg@2x.jpg") no-repeat top center / cover;
		padding: 15% 0;
		color: #fff;
		text-align: center;
	}
	.anxiety__map {
		margin-top: 10%;;
	}
	.anxiety__even {
		background-color: #fff;
		padding: 10% 0;
		text-align: center;
	}
	.anxiety__damage {
		background: url(../images/pc/anxiety_bg_crack.jpg) no-repeat center center / cover;
		padding: 10% 0;
		color: #fff;
		text-align: center;
	}
}

/* ==========================================================================
 * Ideal
 * ========================================================================== */
.ideal {
	background: url(../images/pc/ideal_bg.jpg) no-repeat center center / cover;
	padding: 80px 0;
}
.ideal__flex {
	display: flex;
	justify-content: space-between;
}
.ideal__award {
	margin: 60px 0 20px;
}
.ideal__times {
	margin: 40px 0 0;
	text-align: center;
}

@media screen and (max-width: 640px) {
	.ideal {
		background: url(../images/sp/ideal_bg@2x.jpg) no-repeat center center / cover;
		padding: 15% 0;
	}
	.ideal__flex {
		display: block;
		justify-content: space-between;
	}
	.ideal__txt--block {
		margin-bottom: 8%;
	}
	.ideal__award {
		margin: 15% 0 3%;
	}
	.ideal__times {
		margin: 10% 0 0;
		text-align: center;
	}
}

/* ==========================================================================
 * Resistance
 * ========================================================================== */
.resistance {
	background-color: #0e3552;
	padding: 130px 0 80px;
	color: #fff;
}
.resistance h2 {
	text-align: center;
}
.resistance__sb {
	margin: 60px 0 40px;
}

.resistance__comparison--ttl {
	color: #0e3552;
	background-color: #fff;
	padding: 20px 0;
	text-align: center;
	font-weight: 500;
}

.video-wrapper {
	position: relative;
	width: 100%;
	padding-top: 56.25%;  /* 高さを16:9に保つ（= 9 ÷ 16 × 100） */
	background: #000;
	overflow: hidden;
	margin-bottom: 60px;
}

.video-wrapper iframe,
.video-wrapper video {
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.resistance__comparison {
	margin: 20px 0 50px;
}
.resistance__table {
	margin-bottom: 10px;
}
.resistance small {
	color: #fff;
}
.resistance__graph--ttl {
	text-align: center;
	margin: 40px 0 50px;
}

@media screen and (max-width: 640px) {
	.resistance {
		background-color: #0e3552;
		padding: 15% 0;
		color: #fff;
	}
	.resistance h2 {
		text-align: center;
	}
	.resistance__sb {
		margin: 10% 0 5%;
	}
	.resistance__comparison--ttl {
		color: #0e3552;
		background-color: #fff;
		padding: 5% 5%;
		text-align: left;
		font-weight: 500;
	}

	.video-wrapper {
		position: relative;
		width: 100%;
		padding-top: 56.25%;  /* 高さを16:9に保つ（= 9 ÷ 16 × 100） */
		background: #000;
		overflow: hidden;
		margin-bottom: 10%;
	}

	.video-wrapper iframe,
	.video-wrapper video {
		position: absolute;
		top: 0; left: 0;
		width: 100%;
		height: 100%;
		border: 0;
	}

	.resistance__comparison {
		display: none;
	}
	
	.resistance__table {
		overflow-x: scroll;
        width: 100%;
        padding-bottom: 3vw;
		margin: 5% 0 0;
		position: relative;
	}
	.resistance__table::before {
		content: "";
        position: absolute;
        top: 60%;
        left: 62%;
        transform: translate(-50%, -50%);
        width: 110px;
        height: 120px;
        background-image: url("../images/sp/hand_arrow@2x.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        z-index: 10;
        pointer-events: none;
        animation: pulse 2s infinite;
	}
	.resistance__table.scrolled::before {
		display: none;
	}
	.resistance__table picture {
		width: 130%;
        display: block;
	}
	.resistance__graph--ttl {
		text-align: center;
		margin: 8% 0 5%;
	}
}

/* ==========================================================================
 * Reason
 * ========================================================================== */
.reason__equipment {
	background: url(../images/pc/reason_equipment_bg.jpg) no-repeat center center / cover;
	padding: 80px 0;
	color: #0b283e;
	text-align: center;
}
.reason h2 {
	margin-bottom: 60px;
}
.reason__equipment--wall {
	margin: 60px 0 40px;
}
.reason__img--comparison {
	background-color: #fff;
	padding: 40px 110px;
	box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
	margin: 30px 0 0;
}

.reason__safety {
	background: url(../images/pc/reason_safety_bg.jpg) no-repeat center center / cover;
	padding: 40px 0;
	text-align: center;
}

.reason__prevent {
	background: url(../images/pc/reason_prevent_bg.jpg) no-repeat center center / cover;
	padding: 80px 0;
	text-align: center;
}
.reason__prevent--sb01 {
	margin: 40px 0 30px;
}
.reason__prevent--dispersion {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row-reverse;
}
.reason__prevent--dispersion p {
	width: 52%;
	text-align: justify;
}
.reason__prevent--block {
	background-color: #fff;
	padding: 40px 110px;
	box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
	margin: 30px 0 0;
}
.reason__dispersion--ttl {
	background-color: #dddddd;
	width: 332px;
	color: #0b283e;
}
.reason__prevent--sb02 {
	margin: 80px 0 40px;
}
.reason__shaft--block {
	background-color: #fff;
	padding: 40px 110px;
	box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
	margin: 30px 0 0;
}
.reason__shaft--figure02 {
	margin-top: 30px;
}

.reason__design {
	background: url(../images/pc/reason_design_bg.jpg) no-repeat center center / cover;
	padding: 80px 0 0;
	text-align: center;
}
.reason__design--block {
	background-color: #fff;
	padding: 40px 110px;
	box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
	margin: 60px 0 25px;
}
.reason__design .txt25 {
	margin: 60px 0 30px;
}
.reason__design small {
	margin: 20px 0 60px;
	display: block;
	text-align: justify;
}
.reason__design--sou {
	margin: 40px 0 35px;
}
@media screen and (min-width: 641px) {
	.reason__strong--ttl .left-justified {
		margin-left: -11px;
	}
}
@media screen and (max-width: 640px) {
	.reason__equipment {
		background: url("../images/sp/reason_equipment_bg@2x.jpg") no-repeat center center / cover;
		padding: 15% 0;
		color: #0b283e;
		text-align: center;
	}
	.reason h2 {
		margin-bottom: 15%;
	}
	.reason__equipment--ttl {
		width: 80%;
		margin: 0 auto;
	}
	.reason__equipment--wall {
		margin: 10% 0 5%;
	}
	.reason__equipment .txt18 {
		text-align: justify;
	}
	.reason__img--comparison {
		background-color: #fff;
		padding: 10%;
		box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
		margin: 10% 0 0;
	}
	.reason__safety {
		background: url("../images/sp/reason_safety_bg@2x.jpg") no-repeat center center / cover;
		padding: 10% 0;
		text-align: center;
	}

	.reason__prevent {
		background: url("../images/sp/reason_prevent_bg@2x.jpg") no-repeat center center / cover;
		padding: 15% 0;
		text-align: center;
	}
	.reason__prevent--ttl {
		width: 93%;
		margin: 0 auto;
	}
	.reason__prevent--sb01 {
		margin: 10% 0 5%;
	}
	.reason__prevent--dispersion {
		display: block;
		justify-content: space-between;
		align-items: center;
	}
	.reason__prevent--dispersion p {
		width: 100%;
		text-align: justify;
		margin: 5% 0 0;
	}
	.reason__prevent--block {
		background-color: #fff;
		padding: 10%;
		box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
		margin: 10% 0 0;
	}
	.reason__dispersion--ttl {
		background-color: #dddddd;
		width: 332px;
		color: #0b283e;
	}
	.reason__prevent--sb02 {
		margin: 15% 0 2%;
	}
	.reason__shaft--ttl {
		text-align: justify;
	}
	
	.reason__shaft--block {
		background-color: #fff;
		padding: 10%;
		box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
		margin: 10% 0 0;
	}
	.reason__shaft--figure02 {
		margin-top: 30px;
	}

	.reason__design {
		background: url(../images/pc/reason_design_bg.jpg) no-repeat center center / cover;
		padding: 15% 0;
		text-align: center;
	}
	.reason__design--ttl {
		width: 80%;
		margin: 0 auto;
	}
	.reason__design--block {
		background-color: #fff;
		padding: 10%;
		box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
		margin: 10% 0 10%;
	}
	.reason__design--sarani {
		width: 55%;
		margin: 0 auto;
	}
	
	.reason__design .txt25 {
		margin: 5% 0 5%;
	}
	.reason__design small {
		margin: 5% 0 10%;
		text-align: justify;
	}
	.reason__strong--ttl .ttl40 {
		font-size: 1.9rem;
	}
	.reason__strong--ttl .ttl72, .ttl64 {
		font-size: 3rem;
	}
	.reason__design--sou {
		width: 55%;
		margin: 10% auto 0 auto;
	}
	.reason__design--summary {
		margin: 8% 0 0;
	}
}

/* ==========================================================================
 * Grade
 * ========================================================================== */
.grade {
	background-color: #0e3552;
	padding: 80px 0;
	color: #fff;
	text-align: center;
}
.grade__ttl {
	font-size: 4.6rem;
	margin-bottom: 60px;
}
.grade__kitchen {
	margin-bottom: 60px;
}
.grade__bath {
	margin-bottom: 60px;
}

.grade__cta {
	display: inline;
}

.grade__point--ttl {
	margin: 65px 0 60px;
}
.grade__point {
	list-style: none;
	margin: 0;
	padding: 0;
}
.grade__point li {
	display: flex;
	align-items: center;
	justify-content: flex-start; /* デフォルトは左寄せ */
	height: auto;                /* 高さを自動にしておく */
	margin: 40px 0 0;
}
.grade__point li:nth-child(even) {
	justify-content: flex-end;
}
@media screen and (min-width: 641px) {
	.grade__ttl .right-justified {
		margin-right: -10px;
	}
	.grade__point--ttl .right-justified {
		margin-right: -10px;
	}
}
@media screen and (max-width: 640px) {
	.grade {
		background-color: #0e3552;
		padding: 15% 0;
		color: #fff;
		text-align: center;
	}
	.grade__ttl {
		font-size: 10vw;
		margin-bottom: 10%;
	}
	.grade__kitchen {
		margin-bottom: 10%;
	}
	.grade__bath {
		margin-bottom: 10%;
	}

	.grade__cta {
		display: inline;
	}

	.grade__point--ttl {
		margin: 10% 0 10%;
	}
	.grade__point {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.grade__point li {
		display: flex;
		align-items: center;
		justify-content: flex-start; /* デフォルトは左寄せ */
		height: auto;                /* 高さを自動にしておく */
		margin: 7% 0 0;
	}
	.grade__point li:nth-child(even) {
		justify-content: flex-end;
	}
}

/* ==========================================================================
 * Search
 * ========================================================================== */
.search {
	background-color: #fff;
	padding: 80px 0;
	color: #0e3552;
	text-align: center;
}
.search img {
	margin: 60px 0 0;
}

@media screen and (max-width: 640px) {
	.search {
		background-color: #fff;
		padding: 15% 0;
		color: #0e3552;
		text-align: center;
	}
	.search img {
		margin: 10% 0 0;
	}
}

/* ==========================================================================
 * Procedure
 * ========================================================================== */
.procedure {
	background-color: #0e3552;
	padding: 80px 0;
	color: #fff;
	text-align: center;
}
.procedure__item {
	margin: 60px 0 40px;
}
.procedure__flow {
	margin: 60px 0 0;
}

@media screen and (max-width: 640px) {
	.procedure {
		background-color: #0e3552;
		padding: 15% 0;
		color: #fff;
		text-align: center;
	}
	.procedure__item {
		margin: 10% 0 5%;
	}
	.procedure__flow--ttl {
		font-size: 2.9rem;
	}
	.procedure__flow {
		margin: 10% 0 0;
	}
}

/* ==========================================================================
 * Achieve
 * ========================================================================== */
.achieve {
	background: url(../images/pc/achieve_bg.jpg) no-repeat center center / cover;
	padding: 80px 0;
	text-align: center;
}
.achieve__block {
	background-color: #fff;
	padding: 40px;
}
@media screen and (max-width: 640px) {
	.achieve {
		background: url("../images/sp/achieve_bg@2x.jpg") no-repeat center center / cover;
		padding: 15% 0;
		text-align: center;
	}
	.achieve__block {
		background-color: #fff;
		padding: 13% 8%;
	}
}

/* ==========================================================================
 * Voice
 * ========================================================================== */
.voice {
	background: url(../images/pc/voice_bg.jpg) no-repeat center center / cover;
	padding: 80px 0;
	text-align: center;
	color: #fff;
}
.voice__list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.voice__list li {
	display: flex;
	align-items: center;
	justify-content: flex-end; /* デフォルトは左寄せ */
	height: auto;                /* 高さを自動にしておく */
	margin: 60px 0 0;
}
.voice__list li:nth-child(even) {
	justify-content: flex-start;
	margin: 100px 0 0;
}

@media screen and (max-width: 640px) {
	.voice {
		background: url("../images/sp/voice_bg@2x.jpg") no-repeat top center / cover;
		padding: 15% 0;
		text-align: center;
		color: #fff;
	}
	.voice__list {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.voice__list li {
		display: flex;
		align-items: center;
		justify-content: flex-end; /* デフォルトは左寄せ */
		height: auto;                /* 高さを自動にしておく */
		margin: 10% 0 0;
	}
	.voice__list li:nth-child(even) {
		justify-content: flex-start;
		margin: 0;
	}
}

/* ==========================================================================
 * Showroom
 * ========================================================================== */
.showroom {
	background-color: #fff;
	padding: 80px 0;
	color: #0e3552;
	text-align: center;
}
.showroom__ttl {
	display: flex;
	align-items: center;         /* 上下中央揃え */
	text-align: center;
	font-weight: 500;
	gap: 1em;
	margin: 60px 0 40px;
}
.showroom__ttl::before,
.showroom__ttl::after {
	content: "";
	flex: 1;                     /* 横に伸びる */
	height: 1px;                 /* 線の太さ */
	background-color: #0e3552;      /* 線の色 */
}

.showroom__list {
	background-color: #0e3552;
	color: #fff;
	text-align: left;
	margin: 0 0 40px;
}
.showroom__box--flex {
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
}
.showroom__inquiry {
	width: 59%;
}
.showroom__inquiry--flex {
	display: flex;
	align-items: flex-start;
	margin-bottom: 7px;
	gap: 5%;
}
/* 左側のラベル（dt）を固定幅に */
.showroom__inquiry--flex dt {
	width: 6em;              /* お好みで調整（例：6文字分） */
	flex-shrink: 0;
}

/* 右側の内容（dd）は自動で広がる */
.showroom__inquiry--flex dd {
	margin: 0;
	flex: 1;
}
.showroom__space--flex {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	font-size: 1.4rem;
	gap:2%;
	color: #0e3552;
}
.showroom__space--flex li {
	background-color: #fff;
	padding: 2px 10px;
	margin-top: 2%;
}


.showroom__open {
	background-position: 20px 50%;
	position: relative;
	cursor: pointer;
	font-size: 3rem;
	display: block;
	padding: 30px;
}

/* 閉じている状態（展開可能）のアイコン */
#showroom .showroom__open::before {
	content: "";
	margin: auto;
    position: absolute;
    top: 0;
    bottom: 15%;
    right: 1.3em;
    width: 20px;
    height: 20px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(135deg); /* 下向き矢印 */
}

/* 開いている状態（折りたたみ可能）のアイコン */
#showroom .showroom__close::after {
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: -10%;
    right: 1.3em;
    width: 20px;
    height: 20px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(-45deg); /* 上向き矢印 */
}

.showroom__close {
	font-size: 3rem;
	padding: 30px;
	position: relative;
}
.showroom__box {
	background-position: 20px 50%;
	display: none;
	padding: 0 30px 30px 30px;
}




/* 無効化された入力要素のスタイル（オプション） */
.visible__showroom input:disabled,
.visible__showroom select:disabled,
.visible__showroom textarea:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}



@media screen and (max-width: 640px) {
	.showroom {
		background-color: #fff;
		padding: 15% 0;
		color: #0e3552;
		text-align: center;
	}
	.showroom__ttl {
		display: flex;
		align-items: center;         /* 上下中央揃え */
		text-align: center;
		font-weight: 500;
		gap: 1em;
		margin: 7% 0 5%;
	}
	.showroom__ttl::before,
	.showroom__ttl::after {
		content: "";
		flex: 1;                     /* 横に伸びる */
		height: 1px;                 /* 線の太さ */
		background-color: #0e3552;      /* 線の色 */
	}

	.showroom__list {
		background-color: #0e3552;
		color: #fff;
		text-align: left;
		margin: 0 0 7%;
	}
	.showroom__box--flex {
		display: block;
		justify-content: space-between;
		margin-bottom: 30px;
	}
	.showroom__inquiry {
		width: 100%;
	}
	.showroom__inquiry--flex {
		display: flex;
		align-items: flex-start;
		margin-bottom: 7px;
		gap: 5%;
		font-size: 1.2rem;
	}
	/* 左側のラベル（dt）を固定幅に */
	.showroom__inquiry--flex dt {
		width: 6em;              /* お好みで調整（例：6文字分） */
		flex-shrink: 0;
	}

	/* 右側の内容（dd）は自動で広がる */
	.showroom__inquiry--flex dd {
		margin: 0;
		flex: 1;
	}
	.showroom__space--flex {
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		font-size: 1.4rem;
		gap:2%;
		color: #0e3552;
	}
	.showroom__space--flex li {
		background-color: #fff;
		padding: 2px 10px;
		margin-top: 2%;
		font-size: 1.2rem;
	}


	.showroom__open {
		background-position: 20px 50%;
		position: relative;
		cursor: pointer;
		font-size: 2rem;
		display: block;
		padding: 6%;
		text-align: center;
	}
		/* 閉じている状態（展開可能）のアイコン */
	#showroom .showroom__open::before {
		content: "";
		margin: auto;
		position: absolute;
		top: 0;
		bottom: 10%;
		right: 0.9em;
		width: 12px;
		height: 12px;
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		transform: rotate(135deg); /* 下向き矢印 */
	}

	/* 開いている状態（折りたたみ可能）のアイコン */
	#showroom .showroom__close::after {
		content: "";
		margin: auto;
		position: absolute;
		top: 0;
		bottom: -10%;
		right: 0.9em;
		width: 12px;
		height: 12px;
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		transform: rotate(-45deg); /* 上向き矢印 */
	}
	.showroom__close {
		font-size: 2rem;
		padding: 6%;
		text-align: center;
	}
	.showroom__box {
		background-position: 20px 50%;
		display: none;
		padding: 0 3% 10% 3%;
	}
	.showroom__img {
		margin: 5% 0 0;
	}
}

/* ==========================================================================
 * Faq
 * ========================================================================== */
.faq {
	background-color: #0e3552;
	padding: 80px 0;
	color: #fff;
}
.faq__ttl {
	text-align: center;
	margin: 0 0 60px;
	scroll-margin-top: 80px;
}
#faq ul {
	margin-top: 40px;
}
#faq ul li+li{
	margin-top: 30px;
}
.faq__qaList dl {
	border: solid 1px #fff;
}
.faq__qaList dt {
	background: url("../images/pc/faq_q_icon.png") left top no-repeat;
	background-position: 30px 50%;
	font-size: 3rem;
	color: #fff;
	padding: 25px 50px 25px 70px;
	position: relative;
	cursor: pointer;
}
.faq__qaList dt.open::before {
	align-items: center;
	content: "＋";
	position: absolute;
	color: #fff;
	right: 1.5em;
	width: 20px;
}
.faq__qaList dt.close::after {
    align-items: center;
	content: "－";
	position: absolute;
	color: #fff;
	right: 1.5em;
	width: 20px;
}
.faq__qaList dd {
	background: url("../images/pc/faq_a_icon.png") left top no-repeat;
	background-position: 30px 50%;
	color: #fff;
	font-size: 1.8rem;
    padding: 25px 50px 25px 70px;
	display: none;
}

@media screen and (max-width: 640px) {
	.faq {
		background-color: #0e3552;
		padding: 15% 0;
		color: #fff;
	}
	.faq__ttl {
		text-align: center;
		margin: 0 0 10%;
	}
	#faq ul {
		margin-top: 8%;
	}
	#faq ul li+li{
		margin-top: 30px;
	}
	.faq__qaList dl {
		border: solid 1px #fff;
	}
	.faq__qaList dt {
		background: url("../images/sp/faq_q_icon@2x.png") left top no-repeat;
		background-position: 5% 50%;
		background-size: 7%;
		font-size: 1.8rem;
		color: #fff;
		padding: 3% 15% 3% 15%;
		position: relative;
		cursor: pointer;
	}
	.faq__qaList dt.open::before {
		align-items: center;
		content: "＋";
		position: absolute;
		color: #fff;
		right: 1.5em;
		width: 1%;
		bottom: 37%;
	}
	.faq__qaList dt.close::after {
		align-items: center;
		content: "－";
		position: absolute;
		color: #fff;
		right: 1.5em;
		width: 1%;
		bottom: 37%;
	}
	.faq__qaList dd {
		background: url("../images/sp/faq_a_icon@2x.png") left top no-repeat;
		background-position: 5% 50%;
		background-size: 7%;
		color: #fff;
		font-size: 1.6rem;
		padding: 3% 10% 3% 15%;
		display: none;
		text-align: justify;
	}
}

/* ==========================================================================
 * Form
 * ========================================================================== */
.form {
	background-color: #fff;
	padding: 80px 0 120px 0; /* 下のpaddingを80px → 120pxに増加 */
	color: #0e3552;
	text-align: center;
}
.form__radio--btn {
	text-align: left;
	font-weight: bold;
	margin-bottom: 15px;
}
.form__dl--radio {
	background-color: #d9d9d9;
	color: #fff;
	padding: 5px 15px;
	border-radius: 30px;
	font-size: 2rem;
}
.form__sr--radio {
	background-color: #d9d9d9;
	color: #fff;
	padding: 5px 15px;
	border-radius: 30px;
	font-size: 2rem;
	margin-left: 1%;
}
/* 選択された状態（新規追加） */
.form__dl--radio:has(input[type="radio"]:checked) {
	background-color: #0e3552;
}
.form__sr--radio:has(input[type="radio"]:checked) {
	background-color: #0e3552;
}
.form__showroom--txt {
	text-align: justify;
	margin: 30px 0 50px;
	font-family: "Noto Serif JP";
	width: 100%;
}
.table__box--list {
	font-size: 2rem;
	text-align: center;
}

.form th {
	display: block;
}
.form table {
	margin: 0 auto;
}
.form__box {
	padding: 80px 60px 40px 60px; /* 下のpaddingを減らす */
    font-family: "Yu Gothic";
    margin: 0 auto;
    border: solid 1px #0e3552;
    margin-top: 60px;
    overflow: visible; /* 追加：内容が見切れないようにする */
}

input[type="text"],
input[type="email"],
input[type="tel"],
select,
textarea {
	border: none;
	padding: 10px;
	font-size: 1.6rem;
	width: 100%;
}
::placeholder {
  color: #bcbcbc;
}
.sec__ttl {
	margin: 0 0 50px;
}
.table__box {
	width: 100%;
}
.table__box dt {
	width: 286px;
	text-align: left;
	position: relative;
	font-weight: bold;
	color: #0e3552;
}
.table__box dt::after {
	content:"必須";
	position: absolute;
    top: 50%;
    margin-left: 3%;
    padding: 1px 4px;
    color: #fff;
	background-color: #d5001a;
    font-size: 1.2rem;
    text-align: center;
    transform: translateY(-50%);
}
.any::after {
	display: none;
}
.table__box dd {
	width: 100%;
	border: solid 1px #d6d6d6;
	margin-top: 10px; 
}
.table__privacy {
	text-align: left;
}
.table__privacy dd {
	border: none!important;
}

.table__privacy p label {
	font-size: 1.6rem;
	display: inline-block;
	cursor: pointer;
	align-items: center;
}
.table__privacy p label input {
	cursor: pointer;
	height: 20px;
	margin: 0 10px 0 0;
	width: 20px;
}
.submit {
	margin: 30px 0 0;
	text-align: center;
}
.submit span {
	display: inline-block;
	position: relative;
}
.submit span::after {
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
	content: "";
	display: block;
	position: absolute;
    right: 40px;
    top: 40%;
	transform: rotate(45deg);
	height: 20px;
	width: 20px;
}
.submit input {
	padding: 20px 120px;
	font-size: 3.6rem;
	background: #0071be;
	border-radius: 50px;
	border: none;
	color: #fff;
	cursor: pointer;
	font-weight: bold;
}
.form__regulations {
	font-size: 1.2rem;
}
.form__regulations--link {
	color: #1976b8;
	text-decoration: underline;
	
}
.form__dl {
	width: 100%;
	border: none;
}

.form__sr {
	width: 100%;
	height: 1645px;
	border: none;
}

/* iframe表示制御 */
.visible__download {
    display: block;
}



/* 初期状態では資料請求を表示 */
.form__dl.visible__download {
    height: 1250px;
}
.sitest__goal--confirm {
	background: url("../images/pc/form_btn.png") no-repeat center center / cover;
	padding: 16px 60px 16px 32px;
	border: none;
	border-radius: 50px;
	font-size: 3rem;
	font-weight: 600;
	cursor: pointer;
	min-width: 440px;
	font-family: inherit;
	font-family: "Noto Sans JP" !important;
	text-align: center;
}
.contact__form {
	height: 100%;
	font-family: "Yu Gothic";
} 
.form__cta {
	text-align: center;
	display: flex !important;
    justify-content: center;
    align-items: center;
    position: relative;
    margin-bottom: 40px; /* 下部にマージンを追加 */
}

@media screen and (max-width: 640px) {
	.form {
		background-color: #fff;
		padding: 15% 0 20% 0; /* 下のpaddingを15% → 20%に増加 */
		color: #0e3552;
		text-align: center;
	}
	.form__radio--btn {
		text-align: left;
	}
	.form__radio--btn label {
		display: inline-block;
	}
	.form__dl--radio {
		background-color: #d9d9d9;
		color: #fff;
		padding: 5px 15px;
		border-radius: 30px;
		font-size: 1.6rem;
	}
	.form__sr--radio {
		background-color: #d9d9d9;
		color: #fff;
		padding: 5px 15px;
		border-radius: 30px;
		font-size: 1.6rem;
		margin-left: 1%;
		margin-top: 5%;
	}
	.form__showroom--txt {
		text-align: justify;
		margin: 6% 0 6%;
		font-family: "Noto Serif JP";
		font-size: 1.2rem;
		width: 100%;
	}
	.table__box--list {
		font-size: 1.4rem;
	}

	.form th {
		display: block;
	}
	.form table {
		margin: 0 auto;
	}
	.form__box {
		padding: 15% 5% 5% 5%; /* 下のpaddingを減らす */
        font-family: "Yu Gothic";
        margin: 0 auto;
        border: solid 1px #0e3552;
        margin-top: 10%;
        overflow: visible; /* 追加 */
	}

	input[type="text"],
	input[type="email"],
	input[type="tel"],
	select,
	textarea {
		border: none;
		padding: 3%;
		font-size: 1.4rem;
		width: 100%;
	}
	::placeholder {
	  color: #bcbcbc;
	}
	.sec__ttl {
		margin: 0 0 50px;
	}
	.table__box {
		width: 100%;
	}
	.table__box dt {
		width: 286px;
		text-align: left;
		position: relative;
		font-weight: bold;
	}
	.table__box dt::after {
		content:"必須";
		position: absolute;
		top: 50%;
		margin-left: 3%;
		padding: 1px 4px;
		color: #fff;
		background-color: #d5001a;
		font-size: 1.2rem;
		text-align: center;
		transform: translateY(-50%);
	}
	.any::after {
		display: none;
	}
	.table__box dd {
		width: 100%;
		border: solid 1px #d6d6d6;
		margin-top: 2%;
	}
	.table__privacy {
		text-align: left;
	}
	.table__privacy dd {
		border: none!important;
	}

	.form .table__privacy p label {
		font-size: 1.6rem;
		display: inline-block;
		cursor: pointer;
		align-items: center;
	}
	.form .table__privacy p label input {
		cursor: pointer;
		height: 20px;
		margin: 0 10px 0 0;
		width: 20px;
	}
	.submit {
		margin: 30px 0 0;
		text-align: center;
	}
	.submit span {
		display: inline-block;
		position: relative;
	}
	.submit span::after {
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		content: "";
		display: block;
		position: absolute;
		right: 40px;
		top: 40%;
		transform: rotate(45deg);
		height: 20px;
		width: 20px;
	}
	.submit input {
		padding: 20px 120px;
		font-size: 3.6rem;
		background: #0071be;
		border-radius: 50px;
		border: none;
		color: #fff;
		cursor: pointer;
		font-weight: bold;
	}
	.form__regulations {
		font-size: 1.2rem;
	}
	.form__regulations--link {
		color: #1976b8;
		text-decoration: underline;

	}
	
	.sitest__goal--confirm {
		background: url("../images/sp/form_btn@2x.png") no-repeat center center / cover;
		color: #fff;
		padding: 10px 53px 10px 25px;
		border: none;
		border-radius: 50px;
		font-size: 2rem;
		font-weight: 600;
		cursor: pointer;
		min-width: 100%;
		font-family: inherit;
		font-family: "Noto Sans JP" !important;
	}
	
	.form__cta span {
		display: contents;
		width: 100%;
		margin: 0 auto;
	}
	.form__dl {
		height: auto;
		border: none;
	}

	.form__sr {
		width: 100%;
		height: 1300px;
		border: none;
	}
	.form__cta {
		margin-bottom: 8%;
	}
	.form__dl.visible__download {
		height: 1000px;
	}
}



@media screen and (max-width: 319px) {
	.xdsoft_datepicker {
		width: 80vw !important;
	}
	.xdsoft_datetimepicker .xdsoft_calendar td,
	.xdsoft_datetimepicker .xdsoft_calendar th {
		font-size: 16px;
	}
	.xdsoft_datetimepicker .xdsoft_calendar td > div {
		padding: 5px;
	}
}




/* ==========================================================================
 * Footer
 * ========================================================================== */
.footer {
	background-color: #0e3552;
	padding: 80px 0;
}
.footer h2 {
	color: #fff;
	text-align: center;
	margin-bottom: 60px;
}

.footer__box {
    background-color: #fff;
    padding: 55px 35px;
	margin-bottom: 30px;
	color: #0e3552;
}
.footer__company {
	margin: 0 auto;
	width: fit-content;
	margin-top: 45px;
}
.footer__box--logo {
	text-align: center;
}
.footer__box dl {
	display: flex;
}
.footer__box dt {
	width: 180px;
}
.footer__box dd {
	margin-left: 0;
}

@media screen and (max-width: 640px) {
	.footer {
		background-color: #0e3552;
		padding: 15% 0;
	}
	.footer h2 {
		color: #fff;
		text-align: center;
		margin-bottom: 10%;
	}

	.footer__box {
		background-color: #fff;
		padding: 10% 5% 5%;
		margin-bottom: 0;
		color: #0e3552;
	}
	.footer__company {
		margin: 0 auto;
		width: fit-content;
		margin-top: 10%;
		font-size: 1.4rem;
	}
	.footer__box--logo {
		text-align: center;
		width: 55%;
		margin: 0 auto;
	}
	.footer__box dl {
		display: block;
	}
	.footer__box dt {
		width: 180px;
	}
	.footer__box dd {
		margin-left: 0;
	}
}

/* ==========================================================================
 * Copyright
 * ========================================================================== */
.copyright {
	background-color: #fff;
	text-align: center;
	padding: 30px 0;
}
.footer__copyright {
	font-size: 1.4rem;
}

@media screen and (max-width: 640px) { 
	.copyright {
		background-color: #fff;
		text-align: center;
		padding: 4% 0;
	}
	.footer__copyright {
		font-size: 1rem;
	}
}


/* ==========================================================================
 * Form
 * ========================================================================== */
/*バリデーション*/
input:invalid,
select:invalid,
textarea:invalid,
input:invalid + span {
	color: #e74c3c !important;
    border: 1px solid #ffa69d !important;
    background-color: #ffe2df;
}

/* バリデーション後の背景色リセット（具体的なセレクタ） */
select:valid {
    background-color: #fff !important;
    color: inherit !important;
    border: none !important;
}

input[type="text"]:valid,
input[type="email"]:valid,
input[type="tel"]:valid,
textarea:valid {
    background-color: #fff !important;
    color: inherit !important;
    border: none !important;
}


input[type="checkbox"],
input[type="radio"],
label {
	cursor: pointer;
	accent-color: #f25d5d;
}
/*バリデーションエラー時の送信ボタン色*/
[type="submit"].disabled {
	background-color: #ffe2df;
}

input[type="radio"] {
	margin-right: 5px;
}




/* ==========================================================================
 * confirm
 * ========================================================================== */
#confirm #form {
	text-align: center;
}
#confirm h1 {
	text-align: center;
	padding: 20px 0;
}
#confirm th {
	font-size: 1.4rem;
    width: 40%;
    text-align: left;
}
#confirm td {
	font-size: 1.4rem;
	padding-left: 10px;
	text-align: left;
}
#confirm .sitest__goal--submit {
	background-color: #d5001a;
    color: #fff;
    padding: 8px 45px 8px 32px;
    border: none;
    border-radius: 50px;
    font-size: 2rem;
    font-weight: 600;
    cursor: pointer;
    min-width: 190px;
    font-family: "Noto Sans JP";
}
table {
	margin: 0 auto;
	margin-top: 20px;
	margin-bottom: 20px;
}

/* 白い円形アイコン */
#confirm .play-icon {
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	width: 24px;
	height: 24px;
	background-color: white;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}

/* 赤い三角形 */
#confirm .play-triangle {
	width: 0;
	height: 0;
	border-left: 8px solid #dc3545;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	margin-left: 2px;
}

#confirm input[type="button"] {
	display: block;
	margin: 15px auto 0 auto;
	font-family: "Noto Sans JP" !important;
}
@media screen and (min-width: 641px) {
	#confirm th {
		font-size: 1.8rem;
		width: 60%;
	}
	#confirm td {
		font-size: 1.8rem;
		padding-left: 10px;
	}
	table {
		margin: 0 auto;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#confirm .sitest__goal--submit {
		background-color: #d5001a;
		color: #fff;
		padding: 16px 60px 16px 32px;
		border: none;
		border-radius: 50px;
		font-size: 3rem;
		font-weight: 600;
		cursor: pointer;
		min-width: 290px;
		font-family: "Noto Sans JP" !important;
	}
}
/* ==========================================================================
 * complete
 * ========================================================================== */

#complete h1 {
	text-align: center;
	margin-top: 20%;
}
#complete .complete__h2 {
	padding: 20px;
	text-align: center;
	font-size: 3.5rem;
	font-weight: bold;
	}
#complete .header {
	display: block;
	background-color: rgba(255, 255, 255, 1);;
	filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.2));
	padding: 2% 0 3%;
}
#complete .headerColorScroll {
	opacity: inherit;
	transform: translateY(0px);
	display: block;
}
#complete #form {
	padding-bottom: 50px;
}
#complete .header__logo img {
		width: 30%;
	}

@media screen and (min-width: 641px) {
	#complete h1{
		margin-top: 10%;
	}
	#complete #form {
		width: 56%;
        margin: 0 auto;
		padding-bottom: 50px;
	}
	#complete .inner-width {
		padding-bottom: 0;
	}
	#complete .header {
		display: block;
		background-color: rgba(255, 255, 255, 1);;
		filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.2));
		padding: 15px 0;
	}
	#complete .header__logo img {
		width: 19%;
	}
}