@charset "UTF-8";

/*=================================================================
*==================================================================
page style setting
==================================================================*
==================================================================*/
/* ===============================================
wrap_cont
=============================================== */

/* ===============================================
sec_main_view
=============================================== */
.sec_main_view {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: #66b8f0;
}

/* -----------------------------------------------
main_range
----------------------------------------------- */
.sec_main_view .main_range {
	overflow: hidden;
}

.sec_main_view .main_range h2 {
	width: 200%;
	margin: 0 -50%;
	text-align: center;
}

.sec_main_view .main_range img {
}


/* ===============================================
sec_daytime
=============================================== */
/* -----------------------------------------------
ttl_range
----------------------------------------------- */
.sec_daytime .ttl_range {
	padding: 65px 0 65px 0;
}

.sec_daytime .ttl_range .inner_range {
	text-align: center;
}

.sec_daytime .ttl_range h3 {
	display: inline-block;
	color: #0063aa;
	font-size: 36px;
	font-weight: bold;
	text-align: left;
}

.sec_daytime .ttl_range h3 .icon_day {
	display: inline-block;
	width: 53px;
	height: 50px;
	margin: 0 0 0 6px;
	background: url(../../img/contents/index/sec_daytime_icon_day.png) no-repeat 0 0;
	vertical-align: -10px;
}

/* -----------------------------------------------
example_range
----------------------------------------------- */
.sec_daytime .example_range {
	background-color: #f1f3e8;
}

.sec_daytime .example_range .inner_range {
	position: relative;
/*
	width: 710px;
	margin: 0 auto;
*/
	padding: 0 0 60px 0;
}

.sec_daytime .example_range .lay_human_mass {
	position: relative;
	width: 710px;
	margin: 0 auto;
	padding: 60px 0 0 0;
}

.sec_daytime .example_range .lay_human_mass img {
	position: absolute;
	top: 0;
	left: -184px;
	z-index: 1;
}

.sec_daytime .example_range .box_sense {
	position: relative;
	z-index: 2;
}

.sec_daytime .example_range .point_mass {
	margin: 0 0 35px 0;
}

.sec_daytime .example_range .point_mass ul {
	/* flex */
	display: -webkit-flex;
	display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.sec_daytime .example_range .point_mass li {
	margin: 0 0 0 20px;
}

.sec_daytime .example_range .point_mass li:nth-child(1) {
	margin: 0 0 0 0;
}

.sec_daytime .example_range .explanation_mass {
	margin: 0 0 25px 0;
	text-align: center;
}

.sec_daytime .example_range .explanation_mass .txt_area {
	margin: 0 0 10px 0;
	color: #0063aa;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.6;
}

.sec_daytime .example_range .explanation_mass .txt_area .hl {
	color: #ff7300;
}

.sec_daytime .example_range .explanation_mass .note_area li {
	padding: 0 0 0 1em;
	text-indent: -1em;
	font-size: 17px;
}

.sec_daytime .example_range .graph_mass {
	margin: 0 0 0 -38px;
}

.sec_daytime .example_range .graph_mass .graph_area ul {
	/* flex */
	display: -webkit-flex;
	display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.sec_daytime .example_range .graph_mass .graph_area li {
	margin: 0 0 0 64px;
}

.sec_daytime .example_range .graph_mass .graph_area li:first-child {
	margin: 0 0 0 0;
}


/* ===============================================
sec_nighttime
=============================================== */
/* -----------------------------------------------
ttl_range
----------------------------------------------- */
.sec_nighttime .ttl_range {
	padding: 60px 0 60px 0;
}

.sec_nighttime .ttl_range .inner_range {
	text-align: center;
}

.sec_nighttime .ttl_range h3 {
	display: inline-block;
	color: #0063aa;
	font-size: 36px;
	font-weight: bold;
	text-align: left;
}

.sec_nighttime .ttl_range h3 .icon_night {
	display: inline-block;
	width: 43px;
	height: 44px;
	margin: 0 0 0 8px;
	background: url(../../img/contents/index/sec_nighttime_icon_night.png) no-repeat 0 0;
	vertical-align: -10px;
}

/* -----------------------------------------------
example_range
----------------------------------------------- */
.sec_nighttime .example_range {
	background-color: #e0f4e9;
}

.sec_nighttime .example_range .inner_range {
	position: relative;
/*
	width: 710px;
	margin: 0 auto;
*/
	padding: 0 0 55px 0;
}

.sec_nighttime .example_range .lay_human_mass {
	position: relative;
	width: 710px;
	margin: 0 auto;
	padding: 55px 0 0 0;
}

.sec_nighttime .example_range .lay_human_mass img {
	position: absolute;
	top: 0;
	right: -176px;
	z-index: 1;
}

.sec_nighttime .example_range .box_sense {
	position: relative;
	z-index: 2;
}

.sec_nighttime .example_range .point_mass {
	margin: 0 0 35px 0;
}

.sec_nighttime .example_range .point_mass ul {
	/* flex */
	display: -webkit-flex;
	display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.sec_nighttime .example_range .point_mass li {
	margin: 0 0 0 20px;
}

.sec_nighttime .example_range .point_mass li:nth-child(1) {
	margin: 0 0 0 0;
}

.sec_nighttime .example_range .explanation_mass {
	margin: 0 0 35px 0;
	text-align: center;
}

.sec_nighttime .example_range .explanation_mass .txt_area {
	margin: 0 0 10px 0;
	color: #0063aa;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.6;
}

.sec_nighttime .example_range .explanation_mass .txt_area .hl {
	color: #ff7300;
}

.sec_nighttime .example_range .explanation_mass .note_area li {
	padding: 0 0 0 1em;
	text-indent: -1em;
	font-size: 17px;
}

.sec_nighttime .example_range .graph_mass {
	margin: 0 0 0 0;
	text-align: center;
}

.sec_nighttime .example_range .graph_mass .inner_mass {
	display: inline-block;
	text-align: left;
}

.sec_nighttime .example_range .graph_mass .ttl_example_area {
	margin: 0 0 25px 0;
	color: #0063aa;
	font-size: 16px;
}

.sec_nighttime .example_range .graph_mass .graph_area ul {
	/* flex */
	display: -webkit-flex;
	display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.sec_nighttime .example_range .graph_mass .graph_area li {
	margin: 0 0 0 18px;
}

.sec_nighttime .example_range .graph_mass .graph_area li:first-child {
	margin: 0 0 0 0;
}

.sec_nighttime .example_range .graph_mass .note_area {
	padding: 25px 0 0 0;
}

.sec_nighttime .example_range .graph_mass .note_area li {
	display: block;
	margin: 8px 0 0 0;
	padding: 0 0 0 1em;
	text-indent: -1em;
	font-size: 13px;
	text-align: center;
}

.sec_nighttime .example_range .graph_mass .note_area li:first-child {
	margin: 0 0 0 0;
}


/* ===============================================
sec_entry
=============================================== */
.sec_entry {
	background: url(../../img/contents/index/sec_entry_bg_01.png) repeat 0 0;
}

.sec_entry .inner_sec {
	padding: 50px 0 70px 0;
}

/* -----------------------------------------------
ttl_range
----------------------------------------------- */
.sec_entry .ttl_range .ttl_mass {
	margin: 0 0 20px 0;
	text-align: center;
}

.sec_entry .ttl_range .note_mass {
	margin: 0 0 25px 0;
	text-align: center;
}

.sec_entry .ttl_range .note_mass ul {
	display: inline-block;
	text-align: left;
}

.sec_entry .ttl_range .note_mass li {
	padding: 0 0 0 1em;
	text-indent: -1em;
	font-size: 18px;
}

.sec_entry .bt_range .bt_mass {
	text-align: center;
}

.sec_entry .bt_range .bt_mass a {
	position: relative;
	display: inline-block;
	width: 600px;
	padding: 30px 25px 28px 25px;
	border: 2px solid #cb3332;
	border-radius: 7px;
	background-color: #f8423f;
	text-align: center;
	/* box set */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.sec_entry .bt_range .bt_mass a:hover {
	opacity: 0.7;
}

.sec_entry .bt_range .bt_mass a:after {
	position: absolute;
	top: 50%;
	right: 22px;
	display: inline-block;
	content: "";
	margin: -10px 0 0 0;
	padding: 0 0 0 0;
	width: 10px;
	height: 10px;
	border: 3px solid;
	border-color: #ffffff #ffffff transparent transparent;
	font-size: 20px;
	font-style: normal;
	font-weight: normal;
	/* transform */
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.sec_entry .bt_range .bt_mass a .txt {
	color: #ffffff;
	font-size: 25px;
	line-height: 1.1;
	text-shadow: 2px 2px 3px rgb(0 0 0);
}


/* ===============================================
sec_solution
=============================================== */
/* -----------------------------------------------
ttl_range
----------------------------------------------- */
.sec_solution .ttl_range .view_mass {
	padding: 30px 0 0 0;
	text-align: center;
}

.sec_solution .ttl_range .ttl_mass {
	position: relative;
	padding: 12px 0 10px 0;
	background-color: #65b7dc;
}

.sec_solution .ttl_range .ttl_mass:after {
	position: absolute;
	left: 50%;
	bottom: -28px;
	z-index: 2;
	content: "";
	clip-path: polygon(50% 100%, 0 0, 100% 0);
	background: #65b7dc;
	width: 28px;
	height: 28px;
	-webkit-transform: translate(-14px, 0);
	transform: translate(-14px, 0);
}

.sec_solution .ttl_range .ttl_mass h3 {
	color: #ffff90;
	font-size: 30px;
	letter-spacing: 4px;
	line-height: 1.1;
	text-align: center;
}

/* -----------------------------------------------
about_range
----------------------------------------------- */
.sec_solution .about_range {
	padding: 55px 0 55px 0;
}

.sec_solution .about_range .banner_mass {
	text-align: center;
}

.sec_solution .about_range .banner_mass a img:hover {
	opacity: 0.7;
}