@charset "UTF-8";


/* ----------------------------------------------------
basic style of NewLifeSupport
author: HPG_ogiwara
version: April 2022
----------------------------------------------------- */


/** ************************************* **

	TABLE CONTENTS
	---------------------------
		01. Globals
		02. ドロワーメニュー
	---------------------------

** ************************************* **/


/** 01. Globals
**************************************************************** **/
body {
	background-color: #FFFFFF;
}



@media (min-width: 576px) {
	.container {
		width:auto;
		max-width: 540px;
	}
}
@media (min-width: 768px) {
	.container {
		width:auto;
		max-width: 720px;
	}
	#content {
		width: 100%;
		padding: 0px;
		float: left;
	}

}
@media (min-width: 992px) {
	.container {
		width:auto;
		max-width: 960px;
	}

	#content {
	width: 750px;
	float: left;
	}

}
@media (min-width: 1200px) {
	.container {
		width:auto;
		max-width: 1140px;
	}

	#content {
	width: 920px;
	float: left;
	}

}

@media (max-width: 991px) {
	#rightside {
	padding: 15px;
	width: 100%;
	float:none;
	}
}

#header {
	background-color: transparent;
}

#content {
	width: 80%;
}
#content a {
	text-decoration: none;
}
#rightside {
	width: 20%;
}
@media (max-width: 991px) {
	#content {
		width: 100%;
	}
	#rightside {
		display: none;
	}
}
@media (max-width: 768px) {
	#content {
		float: none;
		width: 100%;
	}
}



/* カラー
---------------------------------------------------- */
.brown, .brown a { color: #A58376; }






#header h1 { /* ヘッダー画像貼り替え */
		display: block;
		text-indent: -9999px;
		background: url(/thkseibun/images/common/logo_newlife@2x.svg) no-repeat 0 -1px;
		background-position: left 0 top 0;
		background-size: 350px 40px;
		width: 350px;
		height: 40px;
		top: 18px;
}

#container {
		padding-top: 70px;
}

#overheader {
		display: none;
}

#tabsubarea {
		display: none;
}

@media (max-width: 768px) {
		/*  #header {
  	height: 50px;
	overflow: hidden;
}
*/
		#header h1 { /* ヘッダー画像貼り替え */
				background: url(/thkseibun/images/common/logo_newlife@2x.svg) no-repeat 0 0;
				background-position: left 0 top 0;
				background-size: 250px 40px;
				width: 250px;
				height: 40px;
				top: 15px;
}

		#header h1 a { /* ヘッダー画像貼り替え */
				display: block;
				text-indent: -9999px;
				width: 250px;
				height: 40px;
}

		#global_tab {
				width: 100%;
				background: #FFFFFF;
				height: auto;
				max-height: 2000px;
				float: none;
}

		#overheader {
				display: block;
}

		#overheader .flexnav li a {
				/*	background-color: #3498db;*/
}

		.menu-button {
				position: absolute;
				right: 0px;
				top: 0px;
}

}

@media (max-width: 480px) {
		#header h1 {
				background-size: auto 30px;
				top: 15px;
}

		#header h1 a {
				width: 250px;
				height: 30px;
}

		#container {
				padding-top: 55px;
}
}

.section {
		margin-left: -10px;
		margin-right: -10px;
}

#tiles {
		padding: 0;
		margin-left: -5px !important;
		margin-right: -5px !important;
}

#tiles > .row {}
#tiles .caption h4 {
		margin-bottom: 0.8rem;
}

#tiles .caption p {
		line-height: 1.5;
}

#tiles .tile {
		padding-left: 5px;
		padding-right: 5px;
}

@media (max-width: 768px) {
		#global_titles {
				padding-left: 0px !important;
}

		#leftside {
				margin: 0px !important;
}

		#tiles {
				padding: 0;
}

		#tiles .tile {
				padding-left: 5px;
				padding-right: 5px;
}
}

#tiles .thumbnail {
		margin-bottom: 10px;
}

#content h2 {
		padding: 0;
		padding-top: 6px;
		margin: 0.3em 0 0.5em;
		font-size: 200%;
		line-height: 1.0;
		color: #333333;
		text-indent: -1.8em;
		padding-left: 1.8em;
}

@media (max-width: 768px) {
		#content h2 {
				padding: 0;
				padding-top: 6px;
				margin: 0.3em 0 0.5em;
				font-size: 160%;
				line-height: 1.0;
				color: #333333;
				text-indent: -1.9em;
				padding-left: 1.9em;
}

		#content h2 span {
				line-height: 1.0;
}
}

.yakuhanjp {
		font-family: 'YakuHanJP', "游ゴシック体", YuGothic, "YuGothic M", sans-serif;
}





/** 07. トップの大画像
 **************************************************************** **/
#container .fullview {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	margin-top: -42px;
}

#container .fullview2 {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	margin-top: -72px;
}

.onepage-hero .bg-hero {
	position:absolute;
	height: 500px;
	width: 100%;
	max-height:500px;
	background-position: 50% 50%;
	background-size: cover;
	z-index:0;
}

.onepage-hero .bg-hero-text {
	position: relative;
	color: #FFFFFF;
	z-index: 10;
}

.onepage-hero .bg-hero-text h2 {
	color: #FFFFFF;
	font-size: calc(180% + 0.25vw);
	margin-top: 55px;
	margin-bottom: 3.4vmax;
}

.onepage-hero .bg-hero-text p {
	color: #FFFFFF;
	font-size: calc(90% + 0.15vw);
}

.onepage-hero .bg-hero-text h3 {
	color: #FFFFFF;
	font-size: calc(140% + 0.15vw);
	margin-top: 55px;
	border-bottom: none;
	text-align: center;
}

.onepage-hero2 .bg-hero {
	position:absolute;
	top:50px;
	height: 350px;
	width: 100%;
	max-height:500px;
	background-position: 50% 50%;
	background-size: cover;
	z-index:1;
}

@media (max-width: 768px){
	.onepage-hero2 .bg-hero {
		height: 300px;
	}
}



.bg-dark {
	color:#fff
}

.bg-dark-30:before,.bg-dark-60:before,.bg-dark-90:before,
.bg-purple:before,
.bg-yellow:before,
.bg-pink:before,
.bg-green:before,
.bg-orange:before,
.bg-red:before
 {
	content:" ";left:0
}

.bg-dark-30:before,.bg-dark-60:before,.bg-dark-90:before,.bg-purple:before,
.bg-yellow:before,
.bg-pink:before,
.bg-orange:before,
.bg-green:before,
.bg-red:before {
	position:absolute;height:100%;width:100%;z-index:0;
}

.bg-dark-30:before {
	background-color:rgba(34,34,34,.3);top:0
}

.bg-dark-60:before{
	background:rgba(34,34,34,.6);top:0
}

.bg-dark-90:before{
	background:rgba(34,34,34,.9);top:0
}

.bg-purple:before{
	background:rgba(109,112,213,.8);top:0
}

.bg-yellow:before{
	background:rgba(209,143,4,.8);top:0
}

.bg-red:before{
	background:rgba(223,100,94,.8);top:0
}

.bg-pink:before{
	background:rgba(211,101,169,.8);top:0
}

.bg-orange:before{
	background:rgba(248,132,77,.8);top:0
}

.bg-green:before{
	background:rgba(95,170,113,.8);top:0
}

.bg-white:before{
	background:rgba(255,255,255,0.80);top:0
}


/* -------------------------------------------------- *
 * header
 * -------------------------------------------------- */
.head_bar { 				/* ヘッダーバー */
	/*display: none;*/
}
#global_header.header-shadow #header {
	background-color: rgba(255,255,255,0.80);
	-webkit-transition: 1.2s;
	-moz-transition: 1.2s;
	-o-transition: 1.2s;
	-ms-transition: 1.2s;
	transition: 1.2s;
}

#global_header.header-shadow {
	-webkit-transition: 1.2s;
	-moz-transition: 1.2s;
	-o-transition: 1.2s;
	-ms-transition: 1.2s;
	transition: 1.2s;
	box-shadow:0 0 5px rgba(0,0,0,.1);
}





/* -------------------------------------------------- *
 * HEADER ICON & hamburger menu
 * -------------------------------------------------- */

#header ul.m-header a {
	color: #00bcd4;
}

.m-header-link.header-icon1 .m-header-link-icon {
	background-image: url('/thkseibun/images/icon/icon_1.svg');
}

.m-header-link.header-icon2 .m-header-link-icon {
	background-image: url('/thkseibun/images/icon/icon_2.svg');
}

.m-header-link.header-icon3 .m-header-link-icon {
	background-image: url('/thkseibun/images/icon/icon_3.svg');
}

.m-header-link.header-icon4 .m-header-link-icon {
	background-image: url('/thkseibun/images/icon/icon_4.svg');
}

.m-header-link.header-icon5 .m-header-link-icon {
	background-image: url('/thkseibun/images/icon/icon_5.svg');
}

.m-header-link.header-icon6 .m-header-link-icon {
	background-image: url('/thkseibun/images/icon/icon_6.svg');
}

.m-header-link.header-icon7 .m-header-link-icon {
	background-image: url('/thkseibun/images/icon/icon_7.svg');
}


.menu-trigger {
	background: #00bcd4;
}

#overheader .flexnav li.header {
	background-color: #00bcd4;
}



/* -------------------------------------------------- *
 * footer 修正
 * -------------------------------------------------- */
#social_footer {
	width: 100%;
	z-index: 1;
}

#footer {
	background-color: #00bcd4;
}

#global_footer {
	background-color: #00bcd4;
	color: #FFFFFF;
}

#global_footer a {
	color: #FFFFFF;
}

#footer #copyright {
	text-align: right;
	font-size: 12px;
	line-height: 1.5;
}

#footer #footer_coop {
	text-align: left;
	font-size: 12px;
}

#footer #footer_coop a {
	text-decoration: none;
}

#footer #footer_coop a:hover {
	text-decoration: none;
}

@media all and (max-width: 768px) {
	#footer.container{
	width: auto;
	max-width: 100%;
	}
	
	#global_footer #footer_coop a {
		bottom:0;
	}
	
	#global_footer #copyright {
		bottom:0;
	}
	
	#footer #copyright {
		text-align: center;
		font-size: 11px;
	}
	
	#footer #footer_coop {
		text-align: center;
		font-size: 11px;
	}
}




/** 08. top_button
 **************************************************************** **/
 
.header-nav {
	background: #e1f0fa;
}
#content2 .top_button ul {
	display: -webkit-box;
	display: -moz-box;
	display: flexbox;
	display: flex;
	margin: 0;
	padding: 10px 0 5px;
	list-style: none;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
}
#content2 .top_button a, #content2 .top_button a:link, #content2 .top_button a:visited {
	text-decoration: none;
}
#content2 .top_button a:hover{
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
}
#content2 .top_button li {
	display: inline-block;
	text-decoration: none;
	color: #000000;
	padding: 5px 3px;
	text-align: center;
	width: 25%;
	-webkit-box-flex: initial;
	-moz-box-flex: initial;
	-ms-flex: initial;
	flex: initial;
}
@media screen and (max-width: 991px){
	#content2 .top_button li {
		width: 33%;
	}
}
@media screen and (max-width: 768px){
	#content2 .top_button li {
		width: 50%;
	}
}
@media screen and (min-width: 481px){
	#content2 .top_button ul {
		display: none;
	}
}
@media screen and (max-width: 480px){
	#content2 .top_button li {
		/*width: 14.2%;*/
		width: auto;
	}
}
#content2 .top_button li a {
	position: relative;
	display: block;
	text-align: center;
	border: 3px solid #3498db;
	padding:2px 5px 12px 5px;
	margin: 0 5px;
	box-sizing: border-box;
	font-weight: 600;
	text-transform: uppercase;
	-webkit-tap-highlight-color: transparent;
	transition: 0s ease-out;
	color: #232323;
	background-color: #fff;
}
#content2 .top_button li a .wrap{
  position:absolute;
  top:40%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
}
#content2 .top_button li a:after {
	font-family: 'Font Awesome 5 Free';
	content: "\f054";
	color: #3498db;
	font-weight: 600;
	font-size: 1.2em;
	position: absolute;
	top: 50%;
	right: 10px;
	margin-top: -12px;
}
#content2 .top_button li a:hover {
	background-color: rgba(52,152,219,0.20);
	border: 3px solid #3498db;
}
#content2 .top_button li a .user_icon:before {
	position:relative;
	top: 8px;
	right: 3px;
	content: url(/thkseibun/images/icon/01_user.svg);
	display: inline-block;
	width: 35px;
	height: 35px;
}
#content2 .top_button li a .user2_icon:before {
	position:relative;
	top: 8px;
	right: 3px;
	content: url(/thkseibun/images/icon/05_user.svg);
	display: inline-block;
	width: 35px;
	height: 35px;
}

#content2 .top_button li a .presen_icon:before {
	position:relative;
	top: 8px;
	right: 3px;
	content: url(/thkseibun/images/icon/02_presen.svg);
	display: inline-block;
	width: 35px;
	height: 35px;
}

#content2 .top_button li a .memo_icon{
	left: -10px;
	position: relative;
}

#content2 .top_button li a .memo_icon:before {
	position:relative;
	top: 8px;
	right: 3px;
	content: url(/thkseibun/images/icon/03_memo.svg);
	display: inline-block;
	width: 35px;
	height: 35px;
}

@media screen and (max-width: 768px){
#content2 .top_button li a .memo_icon{
	left: 0px;
	position: relative;
}

#content2 .top_button li {
	padding-top: 5px;
	margin-top: 0;
}


#content2 .top_button li a .wrap{
  position:relative;
	top:50%;
	  transform:translate(-50%,-50%);
  width:100%;
}
}

#content2 .top_button li a .house_icon:before {
	position:relative;
	top: 8px;
	right: 3px;
	content: url(/thkseibun/images/icon/04_house.svg);
	display: inline-block;
	width: 35px;
	height: 35px;
}

#content2 .top_button li a .cart_icon:before {
	position:relative;
	top: 8px;
	right: 3px;
	content: url(/thkseibun/images/icon/05_cart.svg);
	display: inline-block;
	width: 35px;
	height: 35px;
}

#content2 .top_button li a .document_icon:before {
	position:relative;
	top: 8px;
	right: 3px;
	content: url(/thkseibun/images/icon/06_document.svg);
	display: inline-block;
	width: 35px;
	height: 35px;
}


#content2 .top_button li a:hover:before{
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#content2 .top_button li a:active:before{
	top: 7px;
	reft: -7px;
	width: 100%;
	height: 100%;
	z-index: -1;
}
@media (max-width: 480px) {
	#content2 .top_button ul{
		position: fixed;
		width: 100%;
		bottom:0px;
		left: 0;
		padding: 0px 0 0px;
		z-index: 1000;
		background-color: rgba(255,255,255,0.80);
		box-shadow: 0 1px 6px 0 rgb(32 33 36 / 28%);
	}
	#content2 .top_button li {
		margin: 3px auto;
	}
	#content2 .top_button li a {
		position: relative;
		border: 0px solid #232323;
		padding:0;
		margin: auto;
		box-sizing: border-box;
		font-weight: 600;
		text-transform: uppercase;
		text-decoration: none;
		color: #232323;
		text-align: center;
		line-height: 1.2;
		font-size: 9px;
		background-color: rgba(255,255,255,0.00);
		z-index: 1001;
	}


	#content2 .top_button li a:after {
		display: none;
	}
	#content2 .top_button li a:hover {
		background-color: rgba(255,255,255,0.80);
		border: 0px solid #3498db;
	}
	#content2 .top_button li a .user_icon:before {
		position:relative;
		margin: 0 auto 3px;
		top: 0px;
		right: 0px;
		content: url("/thkseibun/images/icon/01_user.svg");
		display: block;
		width: 35px;
		height: 35px;
	}
		#content2 .top_button li a .user2_icon:before {
		position:relative;
		margin: 0 auto 3px;
		top: 0px;
		right: 0px;
		content: url("/thkseibun/images/icon/05_user.svg");
		display: block;
		width: 35px;
		height: 35px;
	}
	#content2 .top_button li a .presen_icon:before {
		position:relative;
		margin: 0 auto 3px;
		top: 0px;
		right: 0px;
		content: url(/thkseibun/images/icon/02_presen.svg);
		display: block;
		width: 35px;
		height: 35px;
	}
	#content2 .top_button li a .memo_icon:before {
		position:relative;
		margin: 0 auto 3px;
		top: 0px;
		right: 0px;
		content: url(/thkseibun/images/icon/03_memo.svg);
		display: block;
		width: 35px;
		height: 35px;
	}

	#content2 .top_button li a .house_icon:before {
		position:relative;
		margin: 0 auto 3px;
		top: 0px;
		right: 0px;
		content: url(/thkseibun/images/icon/04_house.svg);
		display: block;
		width: 35px;
		height: 35px;
	}
	
		#content2 .top_button li a .cart_icon:before {
		position:relative;
		margin: 0 auto 3px;
		top: 0px;
		right: 0px;
		content: url(/thkseibun/images/icon/05_cart.svg);
		display: block;
		width: 35px;
		height: 35px;
	}
		#content2 .top_button li a .document_icon:before {
		position:relative;
		margin: 0 auto 3px;
		top: 0px;
		right: 0px;
		content: url(/thkseibun/images/icon/06_document.svg);
		display: block;
		width: 35px;
		height: 35px;
	}


}


/** 02. ドロワーメニュー
**************************************************************** **/
#overheader {
		display: block;
}

#overheader .flexnav li a {
		background-color: #ffffff;
}

nav.globalnav > .globalnav_bg a {
		background-image: url(/thkseibun/images/common/logo_newlife@2x.svg);
}

@media (max-width: 350px) {
		nav.globalnav > .globalnav_bg a {
				width: 250px;
}
}