@charset "UTF-8";

.main_content {
	position: relative;
	background: #000;
	opacity: 1;
}
.main_content::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: url("../img/illumination_bg.jpg") no-repeat top 600px center;
	background-size: cover;
	opacity: 0.3;
}
.main_2024 {
	padding-top: 120px;
	width: 100%;
	height: 480px;
	background: url("../img/bg.jpg") no-repeat center;
	background-size: cover;
}

.main_illumination {
	font-family: 'Zen Maru Gothic', sans-serif;
}

.main_area {
	padding: 30px 0 80px;
	line-height: normal;
}

.sub_wrap{
	padding: 20px 0;
	overflow: hidden;
}

.sub_left,
.sub_right{
	position: relative;
	width: calc(100% / 2 - 30px);
	transform: rotate(3deg);
}
.sub_left{
	margin-top: -80px;
	margin-right: auto;
	margin-left: -1%;
	padding-left: 1%;
}
.sub_right{
	margin-top: 80px;
	margin-left: auto;
}
.r-ozzone .sub_left{background-color: #32aba4;}
.r-ozzone .sub_right{background-color: #075bad;}

.sub_left_inner,
.sub_right_inner{
	color: #fff;
	box-sizing: border-box;
}

.sub_left_inner{
	text-align: right;
	font-size: 1.2em;
	padding: 1em;
	padding-right: 40px;
}
.sub_left_inner span{
	font-weight: bold;
}

.sub_right_inner{
	padding: 0.5em;
	padding-left: 20px;
	font-weight: bold;
}

.sub_arrow{
	position: absolute;
	top: 0;
	width: 5vh;
	height: 100%;
}
.r-ozzone .left{
	left: -5vh;
    background:
      linear-gradient(to top right, rgba(255,255,255,0) 50%, #075bad 50.5%) no-repeat bottom left/100% 50%,
      linear-gradient(to bottom right, rgba(255,255,255,0) 50%, #075bad 50.5%) no-repeat top right/100% 50%;
}
.r-ozzone .right{
	right: -5vh;
    background:
      linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #32aba4 50.5%) no-repeat top left/100% 50%,
      linear-gradient(to top left, rgba(255,255,255,0) 50%, #32aba4 50.5%) no-repeat bottom right/100% 50%;
}

@media screen and (min-width:1201px) {
	.sub_left_inner{
		width: 600px;
		margin-left: auto;
		font-size: 1.5em;
	}
	.sub_left_inner span{
		font-size: 1.5em;
	}
	.sub_right_inner{
		width: 600px;
		margin-right: calc((100% - 1200px) / 2);
		font-size: 1.5em;
	}
}
@media screen and (max-width:1200px) {
	.sub_left_inner{font-size: 1.2em;}
	.sub_left_inner span{font-size: 1.2em;}
	.sub_right_inner{font-size: 1.2em;}
}
@media screen and (max-width:640px) {
	.sub_left,
	.sub_right{width: calc(100% / 2 + 120px);}
	.sub_left {margin-top: 0;}
}

/* メイン帯 */
.title_wrap{
	margin-top: 30px;
	padding: 100px 0;
	overflow: hidden;
}
.title{
	position: relative;
	margin-top: 2em;
	margin-left: -2em;
	width: calc(100% + 4em);
	padding: 1em 0.5em;
	background: linear-gradient(#830203, #071399);
	transform: rotate(-5deg);
	z-index: 1;
}
.title_inner{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}
.title_inner{
	position: relative;
	text-align: center;
}
.title_inner h1 {
	color: #ffff66;
	font-size: 3em;
	font-weight: bold;
	font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}
.title_inner br{display: none;}
.title_fukidashi {
	position: absolute;
	top: -2.5em;
	left: 50%;
	display: inline-block;
	margin-left: -22em;
	padding: 0.15em 1.2em 0.3em;
	color: #4d00d2;
	font-size: 1.3em;
	font-weight: bold;
	border-radius: 0.2em;
	background: #fff;
	box-shadow: 5px 5px 15px #000;
	transform: rotate(5deg);
	font-family: 'Zen Maru Gothic', sans-serif;
}
.title_fukidashi small{font-size: 0.8em;}
.title_fukidashi::after {
	content: "";
	position: absolute;
	bottom: -25px;
	left: 60%;
	display: block;
	border: 10px solid transparent;
	border-top: 20px solid #fff;
}
@media screen and (max-width:1200px) {
	.title_inner h1{font-size: 2em;}
	.title_fukidashi {margin-left: -18em; font-size: 1.2em;}
}
@media screen and (max-width:640px) {
	.title_inner h1 {font-size: 5vw;}
	.title_inner br{display: block;}
	.title_fukidashi {
		left: 3em;
		margin-left: 0;
		font-size: 3.5vw;
	}
	.title_fukidashi::after {
		bottom: -12px;
		border: 5px solid transparent;
		border-top: 10px solid #ffe1cb;
	}
}


/* 共通フォーマット
------------------------------------------------------------------*/
.r-ozzone h3 {
	display: block;
	margin: 1em 0 0.5em;
	padding: 0.5em;
	box-sizing: border-box;
	color: #fff;
	font-size: 1.8em;
	line-height: 1.2em;
	background: #469861;
}
.r-ozzone h4 {
	position: relative;
	margin-bottom: 10px;
	margin: 1.5em 0 0.5em;
	padding: 0.5em 0;
	box-sizing: border-box;
	line-height: 1.2em;
	text-align: left;
	color: #fff;
	font-size: 2.5em;
	border-bottom: solid 3px #c5c5c5;
}
.r-ozzone h4:after {border-bottom: solid 3px #0fa;}
.bg_r-ozzone {background: #0fa;}

.r-ozzone h5 {
	position: relative;
	margin: 1.5em 0 0;
	padding: 0;
	box-sizing: border-box;
	line-height: 1.2em;
	text-align: left;
	color: #fff;
	font-size: 2em;
	font-weight: bold;
}
.r-ozzone h5::before {
	content: "●";
	position: relative;
	display: inline-block;
	margin-right: 0.5em;
	color: #469861;
}

@media screen and (max-width: 1240px) {
	.r-ozzone h4{margin: 1.5em 1em 1em; font-size: 1.5em;}
	.r-ozzone h5{margin: 1.5em 1em 1em; font-size: 1.5em;}
}
@media screen and (max-width: 640px) {
	.r-ozzone h4{margin: 1.5em 1em 1em; font-size: 1.2em;}
	.r-ozzone h5{margin: 1.5em 1em 1em; font-size: 1.2em;}
}


/* 白枠 */
.illumination_box {
	position: relative;
	margin-top: 30px;
	padding: 40px 0 20px;
	box-sizing: border-box;
	text-align: center;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 0 5px #333;
}
.illumination_box h2 {
	display: block;
	margin-top: 20px;
	padding: 0.5em 0.5em 0.5em 5.5em;
	box-sizing: border-box;
	text-align: left;
	line-height: 1.2em;
	color: #fff;
	font-size: 2em;
	font-weight: bold;
	border-top: 3px solid #0088af;
	border-bottom: 3px solid #0088af;
	background: #005a9b;
}
.illumination_box .icon_q {
	position: absolute;
	top: 30px;
	left: 20px;
	z-index: 2;
	display: block;
	width: 120px;
}
.illumination_box .icon_q img {width: 100%;}

.pd2em {
	padding: 2em;
	box-sizing: border-box;
}

/* ネオン関連
------------------------------------------------------------------*/
/* テキスト-ネオン化 */
.read_text{
	margin: 1em 0;
	color: #fff;
	font-size: 1.5em;
	text-shadow:
		/* 0 0 3px #fff,
		0 0 5px #fff,
		0 0 11px #fff, */
		0 0 5px #0fa,
		0 0 11px #0fa,
		0 0 21px #0fa,
		0 0 30px #0fa,
		0 0 45px #0fa;
}
/* .read_text{
	margin: 1em 0;
	color: #fff;
	font-size: 1.5em;
	text-shadow:
		0 0 7px #fff,
		0 0 10px #fff,
		0 0 21px #fff,
		0 0 42px #0fa,
		0 0 82px #0fa,
		0 0 92px #0fa,
		0 0 102px #0fa,
		0 0 151px #0fa;
} */

/* 枠 -ネオン化 */
.neon figure::-moz-selection,
.neon a::-moz-selection {
	background-color: var(--neon-border-color);
	color: var(--neon-text-color);
}
.neon figure::selection,
.neon a::selection {
	background-color: var(--neon-border-color);
	color: var(--neon-text-color);
}
.neon figure:focus,
.neon a:focus {
	outline: none;
}

@keyframes flicker {
  0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
		text-shadow:
			-0.2rem -0.2rem 1rem #fff,
			0.2rem 0.2rem 1rem #fff,
			0 0 2rem var(--neon-text-color),
			0 0 4rem var(--neon-text-color),
			0 0 6rem var(--neon-text-color),
			0 0 8rem var(--neon-text-color),
			0 0 10rem var(--neon-text-color);
		box-shadow:
			0 0 .5rem #fff,
			inset 0 0 .5rem #fff,
			0 0 2rem var(--neon-border-color),
			inset 0 0 2rem var(--neon-border-color),
			0 0 4rem var(--neon-border-color),
			inset 0 0 4rem var(--neon-border-color);
	}
	/* 55% {
		text-shadow: none;
		box-shadow: none;
	} */
}

@media screen and (max-width:1240px) {
	.read_text{padding: 0 1em;}
}
@media screen and (max-width:640px) {
	.read_text{font-size: 1.2em;}
}


/* 写真並び
------------------------------------------------------------------*/
.illumination_photo2024 {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.illumination_photo2024 figure {
	display: block;
	margin: 1em 0;
	width: 32.333333%;
	padding: 2rem;
	box-sizing: border-box;
	border: 0.2rem solid #fff;
	border-radius: 2rem;
	background: #000;
	animation: flicker 1.5s infinite alternate;
	--neon-text-color: #f40;
	--neon-border-color: #08f;
}
/* .illumination_photo2024 figure:nth-child(1),
.illumination_photo2024 figure:nth-child(2) {
	width: 49%;
} */
.illumination_photo2024::after {
	content: "";
	display: block;
	width: 32.333333%;
	height: 0;
}
.illumination_photo2024 figure a img,
.illumination_photo2024 figure a figcaption {transition: all 0.3s ease;}
.illumination_photo2024 figure:hover {
	--neon-text-color: none;
	--neon-border-color: none;
}
.illumination_photo2024 figure a:hover {opacity: 1;}
.illumination_photo2024 figure a:hover img,
.illumination_photo2024 figure a:hover figcaption {transform: scale(1.1)}
.illumination_photo2024 figure figcaption {position: relative; z-index: 2; text-align: center; color: #fff;}

@media screen and (max-width:1240px) {
	.illumination_photo2024 {margin: 1em;}
}
@media screen and (max-width:960px) {
	.illumination_photo2024 figure {width: 49%}
	/* .illumination_photo2024 figure:nth-child(1),
	.illumination_photo2024 figure:nth-child(2) {
		width: 100%;
	} */
	.illumination_photo2024::after {width: 49%}
}
@media screen and (max-width:640px) {
	.illumination_photo2024 figure {
		margin: 0.5em 0;
		padding: 1rem;
	}
}

/*過去分*/
.illumination_photo {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.illumination_photo figure {
	display: block;
	margin: 1em 0;
	width: 32.333333%;
	padding: 2rem;
	box-sizing: border-box;
	border: 0.2rem solid #fff;
	border-radius: 2rem;
	background: #000;
	animation: flicker 1.5s infinite alternate;
	--neon-text-color: #f40;
	--neon-border-color: #08f;
}
.illumination_photo::after {
	content: "";
	display: block;
	width: 32.333333%;
	height: 0;
}
.illumination_photo figure a img,
.illumination_photo figure a figcaption {transition: all 0.3s ease;}
.illumination_photo figure:hover {
	--neon-text-color: none;
	--neon-border-color: none;
}
.illumination_photo figure a:hover {opacity: 1;}
.illumination_photo figure a:hover img,
.illumination_photo figure a:hover figcaption {transform: scale(1.1);}
.illumination_photo figure figcaption {position: relative; z-index: 2; text-align: center; color: #fff;}

@media screen and (max-width:1240px) {
	.illumination_photo {margin: 1em;}
}
@media screen and (max-width:960px) {
	.illumination_photo figure {width: 49%}
	.illumination_photo::after {width: 49%}
}
@media screen and (max-width:640px) {
	.illumination_photo figure {
		margin: 0.5em 0;
		padding: 1rem;
	}
}


/* 動画並び
------------------------------------------------------------------*/
.illumination_movie {
	position: relative;
	display: block;
	margin: 1em auto 3em;
	width: 720px;
	height: 405px;
}
.illumination_movie iframe {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}
@media screen and (max-width:800px) {
	.illumination_movie {
		margin: 1em 1em 3em;
		width: calc(100% - 2em);
		height: auto;
		padding-top: 56.25%;
	}
}


/* リンク並び
------------------------------------------------------------------*/
.illumination_link {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.illumination_link figure {
	display: block;
	margin: 1em 0;
	width: 32.333333%;
	padding: 2rem;
	box-sizing: border-box;
	border: 0.2rem solid #fff;
	border-radius: 2rem;
	background: #000;
	animation: flicker 1.5s infinite alternate;
	--neon-text-color: #08f;
	--neon-border-color: #08f;
}
.illumination_link::after {
	content: "";
	display: block;
	width: 32.333333%;
	height: 0;
}
.illumination_link figure a {
	color: #fff;
	font-size: 1.2em;
	font-weight: bold;
}
.illumination_link figure:hover {
	--neon-text-color: none;
	--neon-border-color: none;
}
.illumination_link figure a:hover {
	opacity: 1;
}

@media screen and (max-width:640px) {
	.illumination_link figure {
		margin: 1em;
		width: 100%;
	}
}


/* 2024年問題 - 労働環境
------------------------------------------------------------------*/
.graph_list{
	display: flex;
	flex-wrap: wrap;
	padding: 1em;
	box-sizing: border-box;
}
.graph_list li{
	width: 31.333333%;
	margin: 0 1%;
}
.graph_list li p{
	padding: 0.5em 1em;
	border: 2px solid #333;
	border-radius: 2em;
	font-weight: bolder;
	text-align: center;
}
.graph_list li figure{margin-top: 20px;}
.graph_list li figure img{width: 100%;}

@media screen and (max-width: 640px) {
	.graph_list li{width: 98%;}
	.graph_list li figure{margin-bottom: 20px;}
}


/* 下矢印 */
.triangle{
	position: relative;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px 0 30px;
	text-align: center;
}
.triangle::before{
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -15%;
	width: 30%;
	height: 100%;
	background:
	linear-gradient(to top right, rgba(255,255,255,0) 50%, #469861 50.5%) no-repeat top left/50% 100%,
	linear-gradient(to top left, rgba(255,255,255,0) 50%, #469861 50.5%) no-repeat top right/50% 100%;
	z-index: 1;
}
.triangle p{
	position: relative;
	color: #ff0;
	font-size: 1.6em;
	text-align: center;
	/* text-shadow: 0 0 5px #000; */
	z-index: 2;
}
.triangle p strong {font-size: 2em;}

@media screen and (max-width: 640px) {
	.triangle p {font-size: 4vw;}
	.triangle p strong {font-size: 6vw;}
}

/* Rおっぞんメイン
------------------------------------------------------------------*/
.solution_content{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}
.r-ozzone .solution_bg{
	position: relative;
	height: 557px;
	background: url(../img/solution_bg.jpg) no-repeat center bottom;
}

.r-ozzone .solution_content p{
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 15px;
	width: 100%;
	line-height: 1.2em;
	background-color: #c7000b;
	color: #fff000;
	font-size: 2em;
	font-weight: bold;
	text-align: center;
	box-sizing: border-box;
}
.r-ozzone .solution_content p span{
	display: inline-block;
	width: 160px;
	margin: 0 0.5em;
	vertical-align: middle;
}
.fukidasi{
	position: absolute;
	left: 0;
	top: -20px;
}
.photo{
	position: absolute;
	right: 0;
	top: -20px;
}

/* Googleフォーム */
.campaign_form {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 50px auto;
	width: 100%;
	padding: 0 0.5em;
}
.campaign_form p {
	margin: 0 0 1em;
}
.campaign_form .form_guide {
	max-width: 240px;
	width: calc(100% - 640px);
	height: 100%;
}
.campaign_form .form_guide img {
	width: 100%;
}
.campaign_form iframe {
	max-width: 600px;
	width: 100%;
}

@media all and (max-width: 1200px) {
	.campaign_form {
		padding: 0 0.5em;
		box-sizing: border-box;
	}
}
@media all and (max-width: 900px) {
	.campaign_form .form_guide {display: none;}
}
@media screen and (max-width: 640px) {
	.solution_content p{font-size: 1em;}
	.photo{display: none;}
	.campaign_form {width: 100%;}
	.r-ozzone .solution_content p {font-size: 1.5em;}
	.r-ozzone .fukidasi {top:auto; bottom:140px; max-width: 200px;}
	.soroban .solution_content p {font-size: 1.5em;}
	.soroban .fukidasi {top:auto; bottom:120px; max-width: 200px;}
}


/* ロウ付けとの比較
------------------------------------------------------------------*/
.training {
	display: flex;
	flex-wrap: wrap;
	padding: 30px;
	box-sizing: border-box;
}
.training_left,
.training_right {
	position: relative;
	display: block;
	width: 50%;
	padding: 1em;
	box-sizing: border-box;
}
.training_copy1 {
	position: absolute;
	top: -0.5em;
	left: 30px;
	z-index: 2;
	display: inline-block;
	padding: 0.2em 2em;
	box-sizing: border-box;
	color: #fff;
	border-radius: 12px 0;
	background: #c7000b;
	transform: rotate(-5deg) skewX(-15deg);
}
.r-ozzone .training_copy2 {
	position: absolute;
	top: -0.5em;
	left: 30px;
	z-index: 2;
	display: inline-block;
	padding: 0.2em 2em;
	box-sizing: border-box;
	color: #fff;
	border-radius: 12px 0;
	background: #339967;
	transform: rotate(-5deg) skewX(-15deg);
}

.training_title {
	margin-bottom: 0.5em;
	padding: 0.3em 1em;
	color: #fff;
	background: #333;
}
.training strong {font-size: 1.5em; line-height: 1.5em;}
.training span {color: #c7000b;}
.training figcaption {text-align: right; font-size: 0.8em;}
.training img {margin-top: 0.5em;}

@media screen and (max-width: 640px) {
	.training {padding: 1em 0;}
	.training_left,
	.training_right {margin: 1em 0; width: 100%;}
	.training_title {padding-top: 1em;}
	.training p {font-size: 0.8em;}
	.training figcaption {font-size: 0.6em;}
}


/* 今から対策
------------------------------------------------------------------*/
.r-ozzone .questionnaire_catch {
	position: relative;
	margin-bottom: 50px;
	padding: 2em;
	box-sizing: border-box;
	text-align: center;
	border-radius: 20px;
	background: #005a9b;
}
.r-ozzone .questionnaire_catch::after {
	content: "";
	position: absolute;
	bottom: -40px;
	left: 50%;
	display: block;
	margin-left: -20px;
	border: 20px solid transparent;
	border-top: 20px solid #005a9b;
}
.r-ozzone .questionnaire_catch p {
	line-height: 1.5em;
	color: #fff;
	font-size: 1.8em;
	font-weight: bold;
}
.questionnaire_catch img {
	position: absolute;
	right: 8%;
	bottom: 0;
	z-index: 2;
	display: block;
	height: 240px;
}

/* リンクエリア - Rおっぞん
------------------------------------------------------------------*/
.link_area{
	text-align: center;
	line-height: 1.8;
}
.link_bnr{
	display: inline-block;
	max-width: 640px;
	vertical-align: bottom;
	text-align: center;
}
.link_bnr strong {
	margin-bottom: 0.2em;
	line-height: 1.2em;
	color: #fff;
	font-weight: bold;
}
.link_bnr img{width: 100%;}

/* .link_area_alumi>a{
	margin: 1%;
	width: 47%;
} */
.link_btns{
	display: inline-block;
	flex-wrap: wrap;
	max-width: 300px;
}
.link_btns li {width: 100%;}
.link_btns li a {width: 100%;}
.link_btns li a img {width: 100%;}


.indent10_list li{
	text-indent: -1em;
	padding-left: 1em;
}
.mb10e{margin-bottom: 1em;}
.mt20{margin-top: 20px;}
.mt30{margin-top: 30px;}
.mt50{margin-top: 50px;}
.pb50{padding-bottom: 50px;}

.text_center{text-align: center !important;}


@media screen and (max-width: 1200px) {
	.main_questionnaire {padding: 0 1.5em;}
	.questionnaire_box h2 {
		padding: 0.5em 0.5em 0.5em 125px;
		font-size: 1.2em;
	}
	.questionnaire_box .icon_q {
		top: 25px;
		left: 3%;
		width: 90px;
	}
	.questionnaire_catch img {display: none;}
	.link_btns li {width: 50%;}
}
@media screen and (max-width: 640px) {
	.main_questionnaire {padding: 0 1em;}
	.questionnaire_main_box p {font-size: 1em;}
	.questionnaire_box h2 {
		padding: 0.5em;
		font-size: 1.2em;
	}
	.questionnaire_box .icon_q {
		top: -12px;
		left: 5%;
		width: 72px;
	}
	.questionnaire_catch {padding: 1em 0.5em;}
	.questionnaire_catch p {font-size: 0.9em;}
	.link_btns li {width: 100%;}
	.link_area_alumi>a{width: 100%;}
}


/* リンクナビ - 冷媒配管
------------------------------------------------------------------*/
.pipe_page_menu {
	position: relative;
	background: #fff;
}