/*
共通
================================================ */
main img {height: auto;vertical-align: bottom;width: 100%;}
#content{font-family: 'Noto Sans JP', sans-serif;color: #000000;line-height: 1.875;}
.pc_only {display: block;}
.sp_only {display: none;}
.pagetop { position: relative; z-index: 1100; }
.pagetop.js-fixed > p { position: fixed; }
.pagetop p { position: absolute; bottom: 0; right: 40px; display: none; }
.pagetop p a { background-color: #414141; border-radius: 4px 4px 0 0; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; }
.pagetop img { width: 64px; transition: transform 0.3s; }
.main-visual {height: 240px;background: url(/ldm/multi/threaded-joint-seminar/img/img_mv_bg.png) center top no-repeat; background-size: cover; display: block;}
.main-visual__inner {display: flex;justify-content: center;align-items: center;height: 100%;position: relative;max-width: 1380px;margin: 0 auto;padding: 0 20px;}
.main-visual__deco { position: absolute; right: 0%; top: 33%; }
.container {max-width: 1406px; margin: 0 auto; padding: 0 13px;}
.section {margin-top: 100px;}
.section--bg {background-color: #f2f2f2;padding-top: 80px;padding-bottom: 150px;}
.heading {overflow: hidden;text-align: center;font-size: calc(42 / 16 * 1em);}
.heading span { position: relative; padding: 0 18px; }
.heading span::before { background-color: #c3c3c3; content: ""; position: absolute; top: 50%; left: 100%; width: 100vw; height: 1px; }
.heading span::after { background-color: #c3c3c3; content: ""; position: absolute; top: 50%; right: 100%; width: 100vw; height: 1px; }
.lead {text-align: center;margin-top: 30px;}
.download-btn {max-width: 500px; margin: 30px auto 0;}
.btn-area {margin-top: 30px;}
a.btn-primary,
button.btn-primary {display: inline-flex; align-items: center; justify-content: center; gap: 12px;padding: 20px 30px; color: #fff; text-decoration: none; border: none; border-radius: 10px; position: relative; width: 100%; background-color: #0023a1;font-size: calc(20 / 16 * 1em);transition: opacity 0.3s;font-weight: 700;cursor: pointer;}
a.btn-primary.download::before,
button.btn-primary.download::before {content: ''; display: inline-block; width: 22px; height: 19px; background: url(/ldm/multi/threaded-joint-seminar/img/img_download.png) center/contain no-repeat; flex-shrink: 0;}
a.btn-primary.download::after,
button.btn-primary.download::after {content: ''; display: inline-block; width: 15px; height: 19px; background: url(/ldm/multi/threaded-joint-seminar/img/img_pdf.png) center/contain no-repeat; flex-shrink: 0;}
a.btn-primary.arrow::after,
button.btn-primary.arrow::after {content: ''; position: absolute; right: 25px; width: 12px; height: 12px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg);}
button.btn-primary:disabled {background-color: #ccc;cursor: not-allowed;opacity: 0.6;}

@media (any-hover: hover) {
	a.btn-primary:hover,
	button.btn-primary:hover:not(:disabled) {opacity: 0.7;}
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
	.main-visual__deco { max-width: 126px;top: 76%; }
}
@media only screen and (max-width: 767.98px) {
	.pc_only {display: none;}
	.sp_only {display: block;}
	.pagetop p a { border-radius: 2px 2px 0 0; width: 45px; height: 45px; }
	.pagetop img { width: 45px; }
	.container { padding: 0 20px; }
	.section {margin-top: 70px;}
	.section + .section {margin-top: 50px;}
	.section--bg {padding-top: 48px;padding-bottom: 70px;}
	.main-visual { height: 160px; background: url(/ldm/multi/threaded-joint-seminar/img/img_mv_bg_sp.png) center top no-repeat;background-size: cover; }
	.main-visual__deco { right: calc(50% - 53px); top: auto;bottom: -48px;max-width: 106px; }
	.main-visual__inner {max-width: 600px;}
	.heading { font-size: calc(28 / 16 * 1em); }
	.heading span {padding: 0 12px;}
	.lead { margin-top: 10px; font-size: calc(14 / 16 * 1em); }
	.download-btn {margin: 10px auto 0;text-align: center;line-height: 1.34;}
	.btn-area { margin-top: 15px; }
	a.btn-primary,
	button.btn-primary { font-size: calc(16 / 16 * 1em); padding: 18px;gap: 9px;border-radius: 5px; }
}
/*
トップページ
================================================ */
.top .main-visual__inner h1 {line-height: 1;}
.top .qa-list__item {display: grid;grid-template-columns: calc(380 / 1380 * 100%) 1fr;position: relative;}
.top .qa-list__head {background-color: #0023a1;color: #fff;font-weight: 700;font-size: calc(22 / 16 * 1em);padding: calc(40 / 380 * 100%);height: 100%;position: relative;display: flex;align-items: center;line-height: 1.6;}
.top .qa-list__head::before { content: ''; position: absolute; top: 0; left: 0; width: 0; height: 0; border-style: solid; border-width: 0 0 30px 30px; border-color: transparent transparent transparent white;}
.top .qa-list__body {background-color: #e6e6e6;padding: 50px calc(40 / 1000 * 100%);height: 100%;position: relative;display: flex;align-items: center;}
.top .qa-list__body::before { content: ''; position: absolute; bottom: 0; right: 0; width: 0; height: 0; border-style: solid; border-width: 30px 30px 0 0; border-color: transparent white transparent transparent; }
.top .qa-list__item + .qa-list__item {margin-top: 20px;}
.top .flow-list {margin: 40px auto 0;background: url(/ldm/multi/threaded-joint-seminar/img/img_flow.jpg) center top no-repeat; background-size: cover; padding: calc(35 / 1380 * 100%);max-width: 1180px;display: grid;grid-template-columns: 1fr 1fr 1fr;gap: calc(150 / 1100 * 100%);}
.top .flow-list__item {font-size: clamp(1rem, 2vw, 1.5rem);font-weight: bold;display: flex; align-items: center;gap: 12px;color: #fff;}
.top .flow-list__item .num {width: clamp(30px, 4.83vw, 58px); aspect-ratio: 58 / 50; clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%); display: flex; align-items: center; justify-content: center; background-color: #fff; color: #0023a1;flex-shrink: 0;font-family: 'Roboto', sans-serif;}
.top .movie-area {margin-top: 80px;}
.top .movie-area__txt {text-align: center;font-weight: 700;font-size: calc(14 / 16 * 1em);}
.top .video-wrapper {position: relative;width: 100%;aspect-ratio: 16 / 9;background: #000;margin-top: 20px;box-shadow: 0px 0px 25px rgba(0, 2, 26, 0.18);}
.top .video-wrapper video {width: 100%;height: 100%;object-fit: cover;display: block;}
.top .video-play-btn {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);background: none;border: none;cursor: pointer;z-index: 10;padding: 0;}
.top .video-play-btn.playing {opacity: 0;pointer-events: none;}
.top .video-play-btn img {display: block;}
@media only screen and (min-width: 768px) {
	.top .main-visual__inner h1 {margin-top: 20px;}
}
@media only screen and (max-width: 767.98px) {
	.top .qa-list__head { font-size: calc(20 / 16 * 1em); padding: 23px 20px;min-height: 110px; }
	.top .qa-list__head::before { border-width: 0 0 20px 20px; }
	.top .qa-list__body::before {border-width: 20px 10px 0 0;}
	.top .qa-list__item {grid-template-columns: 1fr;}
	.top .qa-list__body {padding: 24px 20px;font-size: calc(14 / 16 * 1em);}
	.top .flow-list { margin: 12px auto 0; height: 251px; background: url(/ldm/multi/threaded-joint-seminar/img/img_flow_sp.jpg) center top no-repeat; background-size: cover; padding: 17px 20px; grid-template-columns: 1fr;max-width: 335px;gap: calc(130 / 1100 * 100%); }
	.top .flow-list__item { font-size: calc(18 / 16 * 1em); gap: 26px; }
	.top .flow-list__item:nth-child(2) {padding-top: 4px;}
	.top .flow-list__item .num { width: 52px; height: 45px; font-size: calc(21 / 18 * 1em); }
	.top .movie-area { margin-top: 32px; }
	.top .movie-area__txt { font-size: calc(12 / 16 * 1em); }
	.top .video-play-btn { width:55px; }
}


/*
施工要領の確認・受講証明書ダウンロード
================================================ */
.page {position: relative;}
.page #content{padding-bottom: 100px;}
.page::before {content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 503px;background-color: #e6e6e6;z-index: -1;}
.page .container{max-width: 926px;margin: 0 auto;padding: 0 13px;}
.page .main-visual__site-title {max-width: 350px;margin: 0 auto;}
.page .main-visual__title {font-size: calc(50 / 16 * 1em);color: #0023a1;font-weight: 700;margin-top: 20px;line-height: 1;text-align: center;}
.page .work-item {background-color: #f2f2f2;border-radius: 20px;padding: 40px;}
.page .work-item + .work-item {margin-top: 20px;}
.page .work-item__column {display: grid;grid-template-columns: 1fr 395px;gap: 30px;}
.page .work-item__column .work-item__img {margin-top: 0;}
.page .work-item__heading {font-weight: bold;}
.page .work-item__heading h3 {display: flex; align-items: center;gap: 12px;font-size: calc(16 / 16 * 1em);line-height: 1.25;}
.page .work-item__heading .num {width: 58px; height: 50px; clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%); display: flex; align-items: center; justify-content: center; background-color: #0023a1; color: #fff;flex-shrink: 0;font-size: calc(24 / 16 * 1em);font-family: 'Roboto', sans-serif;}
.page .work-item__heading .title {font-size: calc(24 / 16 * 1em);}
.page .work-item__txt {margin-top: 12px;}
.page .work-list {margin-top: 30px;}
.page .work-item .txt-blue {font-weight: 700;color: #0023a1;}
.page .work-item__note {margin-top: 14px;position: relative;padding-left: 1.2em;line-height: 1.5;font-size: calc(14 / 16 * 1em);}
.page .work-item__note .mark {position: absolute;left: 0;}
.page .work-item__note p:first-of-type {font-weight: 700;}
.page .work-item__img {margin-top: 20px;}
.page .work-item__img img{border-radius: 10px;}
.page .attention {text-align: center;color: #ca0200;margin-top: 16px;font-size: calc(14 / 16 * 1em);}
.page .download-area {margin-top: 50px;background-color: #f2f2f2;border-radius: 10px;padding: 60px 0;}
.page .download-area__inner {max-width: 500px;margin: 0 auto;}
.page .download-area__cover {box-shadow: 0px 0px 25px rgba(0, 2, 26, 0.11);}
.page .contact-btn {max-width: 500px;margin: 40px auto 0;}
.page .contact-btn a.btn-primary,
.page .contact-btn button.btn-primary {background-color: #fff;border: 2px solid #0023a1;color: #0023a1;font-weight: 700;}
.page .contact-btn a.btn-primary.arrow::after,
.page .contact-btn button.btn-primary.arrow::after { border-top: 2px solid #0023a1; border-right: 2px solid #0023a1;}
.page.page-03::before {height: 330px;}
.page.page-03 .lead {margin-top: 10px;}
.page.page-03 .download-area + .lead {margin-top: 50px;}
@media only screen and (max-width: 767.98px) {
	.page #content{padding-bottom: 60px;}
	.page::before {height: 480px;}
	.page .container{padding: 0 20px;}
	.page .work-item__column { grid-template-columns: 1fr;gap: 20px; }
	.page .main-visual__site-title {max-width: 260px;}
	.page .main-visual__title { font-size: calc(30 / 16 * 1em); margin-top:10px;line-height: 1.2; }
	.page .main-visual__deco {bottom: -68px;}
	.page .work-item { background-color: #f2f2f2; border-radius: 10px; padding: 25px 20px; }
	.page .work-item__heading .num {font-size: calc(21 / 16 * 1em);width: 52px; height: 45px;}
	.page .work-item__heading .title { font-size: calc(18 / 16 * 1em); }
	.page .work-item__txt {font-size: calc(14 / 16 * 1em);}
	.page .work-item__img img { border-radius: 5px; }
	.page .work-item + .work-item { margin-top: 17px; }
	.page .work-item__note {font-size: calc(12 / 16 * 1em);}
	.page .attention {margin-top: 7px;font-size: calc(12 / 16 * 1em);}
	.page .download-area { margin-top: 30px; border-radius: 5px; padding: 20px; }
	.page.page-03::before {height: 300px;}
	.page.page-03 .main-visual__deco{bottom: -74px;}
	.page.page-03 .section {margin-top: 90px;}
	.page.page-03 .download-btn {margin: 20px auto 0;}
	.page.page-03 .download-btn a.btn-primary,
	.page.page-03 .download-btn button.btn-primary { padding: 10px 18px; }
	.page.page-03 .download-area + .lead {margin-top: 40px;}
	.page .contact-btn {margin: 14px auto 0;}
}

/*
入力フォームエリア
================================================ */
.input-form-area {
	max-width: 100%;
	margin: 20px 0 20px;
	padding: 20px;
	background: #ffffff;
	border-radius: 8px;
	border: 1px solid #ddd;
}

.form-group {
	margin-bottom: 20px;
}

.form-group:last-child {
	margin-bottom: 0;
}

.form-group label {
	display: block;
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 8px;
	color: #333;
}

.form-group .required {
	display: inline-block;
	padding: 2px 8px;
	background: #e74c3c;
	color: #fff;
	font-size: 12px;
	font-weight: 500;
	border-radius: 3px;
	margin-left: 8px;
}

.form-group input[type="text"] {
	width: 100%;
	max-width: 100%;
	padding: 12px 16px;
	font-size: 16px;
	border: 1px solid #ddd;
	border-radius: 4px;
	box-sizing: border-box;
	transition: border-color 0.3s ease;
}

.form-group input[type="text"]:focus {
	outline: none;
	border-color: #3498db;
}

.form-group input[type="text"]::placeholder {
	color: #999;
}

@media only screen and (max-width: 767.98px) {
	.input-form-area {
		padding: 15px;
		margin: 15px 0 15px;
	}
	
	.form-group label {
		font-size: 14px;
	}
	
	.form-group input[type="text"] {
		font-size: 16px; /* iOSでズームを防ぐため16px以上 */
	}
}
