@charset "utf-8";
/* CSS Document */

	body{font-feature-settings: "palt" 1;}	

.headpcOnly{display: block;}

/*head inc */	
	#wrapperHeader{width: 100%;margin: 0 auto;}
#wrapperHeader header {height: 66px;display: flex; justify-content: space-around;}
	#wrapperHeader header h1 {width: 297px;
    margin: 0 10px 0;}
	#wrapperHeader header h1 a { color: #3a63a0; }	
	#wrapperHeader heaFder h1 a:link{color: #3a63a0;
    text-decoration: none;}
	
	
/*下層青下線*/
	.bBor{border-bottom: 2px solid #3a63a0;}

	.main_menu{width: 435px;
    padding-top: 0px;
    padding-bottom: 24px;
    margin: 0 auto;
    display: block;}
	

	.mrow{display: -ms-flexbox;
    display: flex;
   /* -ms-flex-wrap: wrap;*/
    margin-right: -15px;
    margin-left: -15px;}
	
	
	.inner{max-width: 495px;
    width:100%;
    margin-left: auto;
    margin-right: auto;}
	
	.col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0;
    max-width: 100%;}
	
	.mrow li {list-style: none;
    text-align: center;
    padding-left: 0;
    padding-right: 0;}
	
	.mrow li a {
		color: #3a63a0;
		text-decoration: none;
    font-size: 0.8rem;
    letter-spacing: .05em;	
  position: relative;
  display: inline-block;
  text-decoration: none;}
	
	.mrow li a::after {
  position: absolute;
  bottom: -8px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #3a63a0;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}
.mrow li a:hover::after {
  bottom: -4px;
  opacity: 1;
  visibility: visible;
}
	
	
	.clum3 {
    -ms-flex: 0 0 50%;
    flex: 0 0 35%;
    max-width: 35%;}
	
	.main_menu li.koukyo a::before {
    background-image: url( "../image/index/icon1.png");}
	.main_menu li.zyutyu a::before {
    background-image: url( "../image/index/icon2.png");}
	.main_menu li.cont a::before {
    background-image: url( "../image/index/icon3.png");}

	.main_menu li a::before {
    content: "";
    display: block;
    width: 100%;
    height: 38px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    margin-bottom: 5px;}
	
	
	.headbtn{align-items: center;
    display: inherit;width: 100%;
    max-width: 150px;margin-right: 7%;}
	
	.infobtn,
	a.infobtn {
		font-size: 0.8rem;
		font-weight: 500;
		line-height: 1.5;
		position: relative;
		display: inline-block;
		padding: 0.3rem 1rem;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		-webkit-transition: all 0.3s;
		transition: all 0.3s;
		text-align: center;
		vertical-align: middle;
		text-decoration: none;
		letter-spacing: 0.1em;
		border-radius: 0.5rem;
		color: #fff;
		background-color: #3a63a0;
		margin-bottom: 1rem;
	}


	.infobtn:hover,
	a.infobtn:hover,a.bluebtn:hover {
	  color: #fff;
	  background: #769dd8;
	}

	a.btnradius {
	  border-radius: 100vh;
	}


	/*ハンバーガーメニュー*/
	/* hamburgerここから */
		/* inputを非表示 */
		.input-hidden{
			display: none;
		}
			/* label */
		.hamburger_switch{
			cursor: pointer;
			position: absolute;
			right:1%;
			top: 0; /* ハンバーガーアイコンの位置（上から） */
			z-index: 9999;
			width: 4em; /* アイコン（クリック可能領域）の幅 */
			height: 4em; /* アイコン（クリック可能領域の）高さ */
		}
		/* メニュー展開時にハンバーガーアイコンを固定 */
		#hamburger1:checked ~ .hamburger_switch{
			position: fixed;
		}
		/* ハンバーガーアイコン */
		.hamburger_switch{background-image: url("../image/index/gnav-menu_o.gif");background-size: contain;width: 55px; background-repeat: no-repeat;margin-top: 5px;}

		/* ハンバーガーアイコン･アニメーション */
		#hamburger1:checked ~ .hamburger_switch{background-image: url("../image/index/gnav-menu_c.gif");background-size: contain;width: 55px;background-repeat: no-repeat;margin-top: 9px;}
		/* メニューエリア */
		.hamburger_menuwrap{
			position: fixed;
			height: 100%;
			background: #ffffff; /* メニューエリアの背景色 */
			padding: 5em 3% 2em;
			z-index: 9998;
			transition: .3s;
			overflow-y: scroll; /* メニュー内容が多い場合に縦スクロールする */
			top: 0;
			left: 100%;
			width: 70%;
			    display: block!important;
		}
		/* メニューリスト */
		.hamburger_menulist{
			margin-right: 3%;
			padding-left: 5% !important; /* !important不要な場合もあり */
			list-style: none;
		}
		.hamburger_menulist li a{
			text-decoration: none;
		}
		/* メニューエリア･アニメーション */
			/* 右から */
		#hamburger1:checked ~ .hamburger_menuwrap{
			left: 68%;
		}
			/* コンテンツカバー */
		#hamburger1:checked ~ .hamburger_cover{
			position: fixed;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			z-index: 9997;
			background: rgba(3,3,3,.5);
			display: block;
		}

/*リスト*/

	 #global-nav{bottom:auto;}
	#global-nav .gnav-cont{
	display:none;
	padding:50px 30px 30px 30px;z-index:9999;transform : scale(1);
	}
	#global-nav .gnav-cont.open{display:block !important;}
	#gnav-menu{
	display:block;
	overflow:hidden;
	position:absolute;
	top: -52px;
	right: 0;
	z-index: 5000;
	margin: 0;
	width: 65px;
	height: 50px;
	background:url(../images/bg/sp/gnav-menu_new.gif) left top no-repeat;
	background-size:65px auto;
	cursor:pointer;
	text-indent:100%;
	}
	#gnav-menu.open{background-position:left -91px;}
	#global-nav .navigation,
	#global-nav .navigation{
	overflow:hidden;
	-webkit-box-shadow:0;
	box-shadow:0;
	margin:0;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	}
	#global-nav .navigation li{
	float:none;
	margin:0;
	padding:0;
	border-bottom:2px solid #ddd !important;
	border-left:0;
	font-size:1em;
	text-align:left !important;
	}
	#global-nav .navigation li:last-child{border-bottom:0 !important;}
	#global-nav .navigation .corporate,
	#global-nav .navigation .info,
	#global-nav .navigation .safety{width:auto;}
	#global-nav .navigation li a,
	#global-nav .navigation li a{
	display:block;
	position:relative;
	padding:12px 20px 10px;
	background:#fff;
	color:#111 !important;
	text-decoration:none !important;
	}
	#global-nav .navigation li a:before{display:none;}
	#global-nav .navigation li a:hover{background:#fff;}
	#global-nav .navigation li a:after,
	#global-nav .navigation li a:after{
	display:block;
	content:'';
	position:absolute;
	right:4px;
	bottom:4px;
	border:5px solid transparent;
	border-right:5px solid #3a63a0;
	border-bottom:5px solid #3a63a0;
	}



	
	.gnav-cont a{color: #3a63a0;text-decoration: none;width: 86%;
    font-size: 0.8rem;}
	.gnav-cont a:hover{opacity: 0.8;}

	.sp_menu_box{display: block;width: 100%;list-style: none;}
	.sp_menu_box li{margin-bottom: 10px;width: 50%}

	.sub_btn{ padding: 10px 10px 10px 35px;}
	.sub_btn li{display: block;padding: 0;width: 100%; margin-bottom: 5px;}
	
	.headbtn2 {
		align-items: center;
		display: inherit;
		width: 100%;
		max-width: 220px;
		margin-right: 7%;}

	.headbtn2 a{color: #fff;}

	.infobtn2, a.infobtn2{
		font-size: 1rem;
		font-weight: 500;
		line-height: 1.5;
		position: relative;
		display: inline-block;
		padding: 0.5rem 1rem;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		-webkit-transition: all 0.3s;
		transition: all 0.3s;
		text-align: center;
		vertical-align: middle;
		text-decoration: none;
		letter-spacing: 0.1em;
		border-radius: 0.5rem;
		color: #fff;
		background-color: #3a63a0;
		margin-bottom: 1rem;}


	.font_b2{font-weight: bold;width: 111px; background: url( "../image/share/btnButtonIcon.png") no-repeat;
        background-size: 9px;
    background-position: 5px 51%;
    display: block;
    margin-bottom: 18px;
    font-size: 1rem!important;
    list-style: none;
    padding: 10px 10px 10px 35px;}

	.font_b{font-weight: bold;width: 111px; background: url( "../image/share/btnButtonIcon.png") no-repeat;
        background-size: 9px;
    background-position: 5px 51%;
    display: block;
    margin-bottom:0px;
    font-size: 1rem!important;
    list-style: none;
    padding: 10px 10px 10px 35px;}

/*END headinc*/	

	
/*footer*/	
	.ismsTxt {
		margin: 10px auto 84px auto;}
	.ismsTxt a:hover{color:#3a63a0; text-decoration:none;}

	#page-top {
    position: fixed!important;
    bottom: 42px;
    right: 24px;
    z-index: 10;width: 40px;}
	
	#contac_box{text-align: center;padding: 16px 0;
    color: #434343;
    font-size: 16px;
    height: 60px;
    width: 100%;
    background: #f4f9ff;}
	
	#contac_box a {
		text-align: center;
    font-size: 14px;
    color: #434343;
    text-decoration: none;}
	
	
	#footerTxt,#footerTxt .copyright {max-width: 1100px;
		width: 100%;}

	

	.footer_bg {
    background-color: #688ec8;
    padding:60px 0 130px;}
	
	.footer_con {
    width: 100%;height:16vh;
    max-width: 600px;
    margin: 0 auto;}

	.footer_con a{color: #ffffff!important;text-decoration: none;}
	#contac_box a:hover,.footer_con a:hover,.ismsTxt a:link{text-decoration: underline;}	


	.title01 {
    margin: 0 0 25px;
    padding-bottom: 10px;}
	
	.title01 > li {text-decoration: none;
    list-style: none;
    float: left;
    margin: 0 4px 10px 0;
    font-size: 0.875em;}

    .title01 .top {
    width: 121px;}

	.cont_title{width: 150px;}

	.mini_cont{list-style: none;margin-left: 5px;
		font-size: 0.8rem;line-height: 2;}

	.main_tt {
    display: block;
    position: relative;
    padding: 8px 5px 6px;
    color: #fff;
    font-weight: bold;
    text-decoration: none;}

	#footerTxt {
		margin: 1.3% auto;}


	/*TOP*/

	.main_vis{ width: 100%;
	height: auto;}	

	#wrapper{width: 100%;max-width: 1100px;margin: 0 auto;}
	#wrapper2{margin: 0 auto;}

	.contents{margin: 40px auto 84px;}
	.contents2{margin: 40px auto 0px;}
	.contents_kasou{width: 100%;max-width: 1100px;margin: 0px auto 84px;}
	.contents_kasou2 {
    width: 100%;
    max-width: 1100px;
    margin: 0px auto 0px;}

	.conttxt{font-size: 1.1rem;line-height: 1.7;}

	.topcontL{
			position: relative;
			background-color:#f5f9ff;
			width: 100%;
			height: auto;
			display: flex;
			padding: 60px;
			margin-bottom: 3%;}

	.topcontR{
			position: relative;
			background-color:#f5f9ff;
			width: 100%;
			height: auto;
			display: flex;
			padding: 60px;
			margin-bottom: 3%;flex-direction: row-reverse;}


	.leftbox {width: 55%;
		margin-top: 13%;
		padding-right: 3%;}

	.rightbox {
		width: 55%;
		margin-top: 13%;
		padding-left: 3%;
	}

	.topObiL{position: absolute;
		font-size: 1.8rem;
		color: #fff;	 
    font-weight: 400;
		background: #678ec7;
		width: 70%;
		top: 20%;
		left: 0;
		z-index: 0;
		max-width: 538px;
		padding: 1% 0 1% 5%;}

	.topObiR {
		position: absolute;
		font-size: 1.8rem;
		color: #fff;
		font-weight: 400;
		background: #678ec7;
		width: 70%;
		top: 20%;
		right: 0;
	    text-align: end;
		z-index: 0;
		max-width: 538px;
		padding:1% 5% 1% 0;
	}


	.thumnail{z-index: 5;}
	.thumnail img{width: 100%;max-width: 640px;}

	 a.morebtn,a.morebtn2{display: block;
		background-color: #fff;
			max-width: 201px;
		text-align: center;
		text-decoration: none;
		color: #3a63a0;
		padding: 8px;
		border-radius: 30px;
		border: solid #3a63a0 3px;
		position: relative;
		font-size: 0.9rem;margin: 0 auto;box-sizing: border-box;}

	a.morebtn::after,a.morebtn2::after{
		content: '';
		   width: 21px;
		height: 6px;
		border-bottom: solid 2px;
		border-right: solid 3px;
		transform: skew( 45deg);
		top: 14px;
		position: absolute;
		right: 15px;
	}

	 a.morebtn:hover, a.morebtn2:hover{border: solid #3a63a0 3px;background-color: #3a63a0;color: #fff;transition: 0.5s;
    box-sizing: border-box;}

	.mintxt{font-size: 0.8rem;
		font-weight: 500;
		text-align: center;
		display: block;margin: 10% auto;}

	.infoicon{margin: 7% auto 3%;
	display: block;width: 100%;
    max-width: 90px;}

.infoicon2{margin: 7% auto 3%;
	display: block;width: 100%;
    max-width: 172px;}

	.infotxt{text-align: center;
    font-size: 0.8rem;
    line-height: 1.5;}

	.infocenter{text-align: center;
		margin: 3% auto 7%;}
	.saiyo_tx{margin: 5% auto;}

	.otrBox2 {
		padding: 0 3%;
	}


	/*共通*/

	.mainBlue{color: #3a63a0}
	.black{color: #434343;}

	.midasi_f{font-size: 1.8rem;}

	.topmidasi{ padding: 1.5rem 0 0;}

	.bor30{border-radius: 30px;}
	.txt-ctr{
	text-align: center;}

	.midasi_m{position: relative;
	text-align: center;margin-bottom: 3rem;}

	.midasi_m:before {
	  position: absolute;
	  bottom: -10px;
	  left: calc(50% - 30px);
	  width: 60px;
	  height: 5px;
	  content: '';
	  border-radius: 3px;
	  background: #3a63a0;
	}


	.serviceBox{display: flex;justify-content: space-between;}
	.serviceCont{width: 49%;
	border:8px solid #eaeaea;}

	 a.bluebtn{
		font-size: 0.8rem;
		   font-weight: 300;
		line-height: 1.5;
		position: relative;
		display: inline-block;
		padding: 0.6rem 2.8rem;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		-webkit-transition: all 0.3s;
		transition: all 0.3s;
		text-align: center;
		vertical-align: middle;
		text-decoration: none;
		letter-spacing: 0.1em;
		border-radius: 30px;
		color: #fff;
		background-color: #3a63a0;
		margin-bottom: 1rem;
	}

		 a.bluebtn::after{
			content: '';
			   width: 21px;
			height: 6px;
			border-bottom: solid 2px;
			border-right: solid 3px;
			transform: skew( 45deg);
			top: 14px;
			position: absolute;
			right: 15px;
		}

	.breadcrumbs{    padding: 16px 0;margin: 0;
		font-size: 0.8rem; list-style: none;}


	.breadcrumb li {
	  display: inline;/*横に並ぶように*/
	  list-style: none;
	  font-weight:300/*太字*/
	}

	.breadcrumb li:after {/* >を表示*/
	  content: '>';
	  padding: 0 1em;
	  color: #434343;
	}

	.breadcrumb li:last-child:after {
	  content: '';
	}

	.breadcrumb li a {
	  text-decoration: underline;
	  color: #434343;/*色*/
	}

	.breadcrumb li a:hover {
	  text-decoration: none;
	}


	.inner-lg {
		max-width: 1100px;
	}
	.inner {
		width: 100%;
		max-width: 1100px;
	  margin: 0 auto
	}

	.top_box1  {position: relative;
				display: block;
				padding-bottom: 9rem;}

	.omidasi{float: left;
		font-size: 2.3rem;}

	.tophead_icon{
		position: absolute;
		width: 100%;
		max-width: 167px;
		bottom: 0;right: 40px;}

	.tophead_icon2 {
		position: absolute;
		width: 100%;
		max-width: 122px;
		bottom: 0;
		right: 40px;}



.bottm80{margin-bottom: 80px;}
.patop80{padding-top: 80px;}
.pabtm80{padding-bottom: 80px;}
.pabottm80{padding: 80px 0;}


/*バナー追加0524*/

.gaibuicon{position: relative;
    margin-right: 0.8rem;}

.gaibuicon::after {
   content: "";
  display: inline-block;
    width: 15px;
    height: 15px;
    background: url("../image/index/gaibu_icon.svg") no-repeat;
    background-size: contain;
    margin-left: 6px;
    position: absolute;
}

.bnrBox{margin-top: 5rem;}

.bnr_fontsize{font-size: 1.4rem;}

	.bannererea{max-width: 1100px;
    flex-wrap: wrap;
		display: flex;
		align-items: baseline;
		justify-content: center;margin: 1.5rem auto 9rem;
		list-style: none;
	}


	.bannererea li img{width: 100%;}
	.bannererea li{
		    width:29%;
		
		margin: 0 0rem 2rem 0;
    /*2個以上 
		
		   width: 30.5%;
		margin: 0 1rem 2rem 0;*/
	}

	.bannererea li:nth-of-type(3n){    margin-right: -1rem;}

	.bannererea li a:hover{opacity: 0.6;transition: 0.5s;}




@media screen and (max-width: 1143px) {

	.headbtn {
    margin-right: 5%;
}
	
	

	.bannererea li {
   width: 31.5%;margin: 0 0rem 2rem 0;
}
}

@media screen and (max-width: 950px) {
	#wrapperHeader header h1 {font-size: 0.8rem;}
	
	#wrapperHeader header {
		height: 62px;}
	
	.mrow li a {font-size: 0.5rem;}
	
	.headbtn {
    margin-right: 3%;
    margin-left: 1%;}
	
	.infobtn, a.infobtn {
		font-size: 0.5rem;}
	
	.main_menu {
		width: 380px;}
	
	
	.leftbox, .rightbox{
		margin-top: 16%;}
	
}


@media screen and (max-width: 768px) {
	
	.headpcOnly{display: none;}
	
	#wrapperHeader header {
	 display: block;	
    position: relative;
    border-bottom: none;}
	
	#wrapperHeader header h1 {margin: 9px 10px 0;font-size: 0.8rem;}
	
	#page-top {
    position: fixed!important;
    bottom: 42px;
    right: 24px;
    z-index: 10;width: 30px;
}
	
	#hamburger1:checked ~ .hamburger_menuwrap {
    left: 0%;
}
	#footerTxt {max-width: 640px;
    width: 100%;}
	
	#footerTxt .copyright {max-width: 640px;
    width: 100%;
    font-size: 10px;
    margin: 10px 0 0 0;}
	
	.hamburger_menuwrap {
    width: 100%;}
	
	.sp_menu_box li {
    width: 90%;}
	
	

	
	
/*共通*/	
	.omidasi {
		font-size: 1.5rem;
	}
	
	.bottm80{margin-bottom: 40px;}
	.patop80{padding-top: 40px;}
	.pabtm80{padding-bottom: 40px;}
	.pabottm80{padding: 40px 0;}


	.midasi_f {font-size: 1.3rem;}
	.conttxt {
    font-size: 0.8rem;
    line-height: 1.5;
}
	.ismsLogo {
    width: 110px;
    margin: 0 auto;
}	
	
}

@media screen and (max-width: 820px) {
	
	.topcontL,.topcontR {padding: 35px;}
	
	.topObiL,.topObiR {
		font-size: 1.5rem;top: 17%;}
	
	.mintxt {
    margin: 4% auto;}
	
	.leftbox,.rightbox{
    width: 83%;
		margin-top: 13%;}
	
	
	.conttxt {
		font-size: 0.9rem;}
	

	
}


@media screen and (max-width: 640px) {

	
/*フッター*/
	
	#contac_box {height: 80px;}
	
	.footer_bg {
    padding: 10% 3% 42% 12%;}
	
	.footer_con {
		height: 25vh;}
	
	.title01{display: flex;
    flex-wrap: wrap;
    width: 100%;}
	
	.title01 .top {
    width: 50%;
}
	
	
	.title01 > li {
    width: 45%;margin: 2% auto;font-size:0.875em;
}
	
	.mini_cont li{margin-bottom: 5px;}
	
		#footerTxt {
		margin:3% auto;}

	
/*TOP*/
	
	.serviceBox {display: block;}
	
	.serviceCont {
		width: 100%;margin-bottom: 3%;}
	
	.infoicon { max-width: 70px;}
	
	.infoicon2 {
		max-width: 120px;}
	
	.infocenter {
    margin: 3% auto 3%;}
	
	.infotxt{
    font-size: 1rem;}
	

	.column_item3 p {
        font-size: 1rem;
    display: block;
    padding: 3% 5% 3%;
}
	
	.mintxt {
    margin: 3% auto 5%;}
	
	a.morebtn{
    font-size: 1.1rem;max-width: 295px;
    padding: 0.7rem 3.8rem;margin-bottom: 10%;
}
	
	
	a.morebtn2 {
    font-size: 1rem;max-width: 198px;
    width: 90%;
    padding: 0.5rem 1.8rem;margin-bottom: 10%;
}
	
	a.morebtn::after{
    content: '';
    width: 27px;
    height: 9px;
    border-bottom: solid 2px;
    border-right: solid 3px;
    transform: skew( 45deg);
    top: 18px;
    position: absolute;
    right: 15px;
}
	
	
	a.morebtn2::after {
    content: '';
    width: 27px;
    height: 9px;
    border-bottom: solid 2px;
    border-right: solid 3px;
    transform: skew( 45deg);
		top: 13px;position: absolute;
    right: 15px;}
	
	.colttl5 {
    font-size: 1.3rem;
    line-height: 1.2;
    padding: 2% 0;
    color: #fff;
    font-weight: 300;text-align: center;}

	
	
	/*パンくず*/
	
	.breadcrumb li {font-size: 0.7rem;}	
	

	/*バナー追加0524*/
	
	.bnr_fontsize {
		font-size: 1.1rem;
	}
	
	
	.gaibuicon{font-size:0.8rem;}
	
	
	.bannererea {display: block;}
	.bannererea li:nth-of-type(3n) {
		margin: 2rem auto;}
	
	.bannererea li img { width: 100%;}
	
	.bannererea li {
		width: 86%;margin: 2rem auto;}
	
	
	
	
	
}

.contents2 .works {	
	border: 2px solid #3a63a0;
	width: 80%;
	margin: 0 auto 30px;
}
.contents2 .works h4 {
	background: #3a63a0;
	color: #FFF;
	padding: 0.5em 1em;
	border-radius: 0 0 1em 0;
	display: inline-block;
}
.contents2 .works h5 {
	color: #3a63a0;
	margin-bottom: 1em;
}
.contents2 .works-wrap {
	padding: 2em;
	display: flex;
	justify-content: space-between;
	gap: 2em;
	align-items: center;
}

.contents2 .works-txt,
.contents2 .works-img { width: calc(50% - 1em);}

.contents2 .works-img img { max-width: 100%; height: auto;}

.livin-imgs {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1em;
}
.livin-imgs li { list-style: none;}
.livin-imgs li img { max-width: 100%; height: auto;}

@media screen and (max-width: 640px) {
	.contents2 .works { width: 100%;}
	.contents2 .works-wrap { 
		flex-direction: column;
		padding: 1em;
		gap: 1em;
	}
	.contents2 .works-txt,
	.contents2 .works-img { width: 100%;}

}