@charset "utf-8";
/* CSS Document */


.hero-simu:before {
  background-image: url(/~/media/SolKepco/decarbonization_roadmap/images/simu_bg.png);
}
.hero-simu {
    background-image: url(/~/media/SolKepco/decarbonization_roadmap/images/simu.png);
	background-position: right 25px top;
}
.hero.hero-simu {
    height: 250px;
}
@media screen and (max-width: 900px) {
	.br-sp-l {
    display: block;
}
}
@media screen and (max-width: 768px) {
	.hero-simu {
	background-size: auto;
	}
}
@media screen and (max-width: 650px) {
	.hero.hero-simu {
    height: 200px;
	padding: 20px;
}
	.hero-simu {
	background-size: 40%;
	background-position: right 0px top;
}
}
@media screen and (max-width: 560px) {
	.hero.hero-simu {
    height: auto;
}
	.hero.no-gap.hero-simu .hero-text-wrap {
	align-items:baseline;
}
	.hero.hero-simu .hero-heading {
    font-size: 6vw;
}
	.hero-text {
    padding-left: 10px;
}
}


.section {
    max-width: 900px;
}
@media screen and (min-width: 1250px) {
.section {
    max-width: 980px;
}
}

.cts-simu sub {
	vertical-align: baseline;
}
.btn.btn-tool:before {
    background-image: url(/~/media/SolKepco/decarbonization_roadmap/images/arw-tool.png);
}
.cts-simu .bg-simu,
.cts-simu .flow-unyou .number {
	background: #0572cc;
}
.cts-simu .primary {
	color: #0572cc;
}
.cts-simu h3.simu-lead {
	color: #0572cc;
	margin-bottom: 0.5em;
    font-size: 1.71em;
    line-height: 1.3;
    font-weight: bold;
	text-align: center;
}
.simu-reason h4 {
	font-size: 1.6rem;
}


.block-menu {
    display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
}
.block-menu .flow-area {
	width: 46%;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
	box-shadow: 2px 2px 3px 2px rgb(0 0 0 / 5%);
}
.block-menu .flow-area:nth-child(2) {
	width: 8%;
	border: none;
	text-align: center;
	position: relative;
	box-shadow: none;
}
.block-menu .flow-area:nth-child(2) img {
	position: absolute;
	top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}
.block-menu .flow-area h3 {
	border-radius: 6px 6px 0 0;
    margin: 0 0 1em 0;
    padding: 0.8em;
    background: #0572ce;
    color: #fff;
    text-align: center;
    text-decoration: none;
	font-size: 2.0rem;
    line-height: 1.4;
    font-weight: bold;
}
.block-menu .flow-area h3 span {
	font-size: 1.6rem;
}
.block-menu .flow-area .text {
	padding: 0 20px;
}
.block-menu .flow-area .flow-title {
	font-size: 1.6rem;
	background-color: #daeaf4;
	padding: 0.8em 0.5em;
	font-weight: bold;
	margin-bottom: 1em;
}
.block-menu .flow-area li {
	text-align: left;
}
.checklist li {
	padding-left: 1.5em;
    text-indent: -1.5em;
	font-size: 1.6rem;
}
.checklist li:before {
	background-image: url(/~/media/SolKepco/decarbonization_roadmap/images/flow_check.png);
	background-size: contain;
}
.ml-1 {
	margin-left: 1em;
}
.flow-unyou > li:not(:first-child):after {
	background-image: url(/~/media/SolKepco/decarbonization_roadmap/images/arrow_down.png);
}

.infoText {
	font-size: 2.4rem;
	font-weight: bold;
	text-align: center;
}
.btn-area {
	display: flex;
	justify-content: center;
    text-align: center;
	font-size: 1.8rem;
    font-weight: bold;
}
.btn-area a {
	text-decoration: none;
    background-color: #0572ce;
    display: block;
    padding: 20px 0 18px;
    color: #fff;
    border-radius: 8px;
    width: 360px;
	position: relative;
}
.btn-area a:after {
	content: "";
    position: absolute;
    margin: auto;
	padding: 0;
    vertical-align: middle;
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	top: 45%;
    right: 20%;
}
.btn-area a:hover {
	opacity: 0.6;
}


.complete .flow-unyou li.rbox {
    padding: 10px 14px 10px 35px;
}
.complete .flow-unyou li.rbox:nth-child(2),
.complete .flow-unyou li.rbox:nth-child(3),
.complete .flow-unyou li.rbox:nth-child(4) {
    background: #ffffff;
	border: 2px solid #0572cc;
}

.cts-simu .bg-primary {
	background-color: #0572ce;
}


.only-pc {display: block;}
.only-sp {display: none;}
@media screen and (max-width: 960px) {
}
@media screen and (max-width: 768px) {
	.block-menu {
    display: flex;
    flex-direction: column;
}
	.block-menu .flow-area {
	width: 100%;
}
	.block-menu .flow-area:nth-child(2) {
	width: 100%;
}
	.block-menu .flow-area:nth-child(2) img {
	position: inherit;
    margin:  10px auto;
}
	.block-menu .flow-area:last-child {
	text-align: center;
	padding-bottom: 20px;
}
	
	.infoText {
	font-size: 1.6rem;
}
	
.only-pc {display: none;}
.only-sp {display: block;}
}
@media screen and (max-width: 560px) {
	.cts-simu h3.simu-lead {
	font-size: 1.8rem;
}
	.block-menu .flow-area h3 {
	font-size: 1.8rem;
}
	.block-menu .flow-area .flow-title {
	font-size: 1.5rem;
}
	.checklist li {
	font-size: 1.4rem;
}
}