@charset 'UTF-8';

/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

	トップページ

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */



/* ================================================================================

	レイアウト

================================================================================ */

/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	#wrapper {
	}

	main.outer_wrap {
		position: relative;
		max-width: none;
		/* max-width: 1920px; 固定幅レイアウト時 */
		width: 100%;
		min-height: 50vh;
		display: block;
		margin: 0 auto;
	}

	.inner_wrap {
		position: relative;
	}
	.pc_h1 {
		display: none;
	}
	
	/* メイン画像 */
	.main_img{
		position:relative;
		margin-left: 9vw;
		width: 90vw !important;
	}
	.main_img ul li {
		width: 91vw;
	}
	.main_img::before{/* scroll画像 */
		position: absolute;
		content: "";
		display: block;
		background: url(../img/scroll_img.png) no-repeat center top / 100% auto;
		width: 3.35vw;
		height: 3vw;
		bottom: 1.5vw;
		left: 50%;
		margin-left: -1.7vw;
	}
}



/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	#wrapper {
	}

	main.outer_wrap {
		position: relative;
		width: 100%;
	}

	.inner_wrap {
		position: relative;
	}
	
	/* メイン画像 */
	.main_img .sp-main_img {
		position: relative;
		margin-top: 30px;
	}
	.main_img .sp-main_img::before{/* scroll画像 
		position: absolute;
		content: "";
		display: block;
		background: url(../img/scroll_img.png) no-repeat center top / 100% auto;
		width: 11.35vw;
		height: 10vw;
		bottom: 5.5vw;
		left: 50%;
		margin-left: -5.7vw;
	*/}
}




/* ================================================================================

	マージンボックス

================================================================================ */

/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {

	/* 上にマージンを空ける
	----------------------------------------------- */
	.top_long {
		margin-top: 120px;
	}
	.top_middle {
		margin-top: 80px;
	}
	.top_short {
		margin-top: 40px;
	}
	.top_vshort {
		margin-top: 20px;
	}

	/* 下にマージンを空ける
	----------------------------------------------- */
	.bottom_long {
		margin-bottom: 120px;
	}
	.bottom_middle {
		margin-bottom: 80px;
	}
	.bottom_short {
		margin-bottom: 40px;
	}
	.bottom_vshort {
		margin-bottom: 20px;
	}

	/* 両方にマージンを空ける
	----------------------------------------------- */
	.both_long {
		margin-top: 120px;
		margin-bottom: 120px;
	}
	.both_middle {
		margin-top: 80px;
		margin-bottom: 80px;
	}
	.both_short {
		margin-top: 40px;
		margin-bottom: 40px;
	}
	.both_vshort {
		margin-top: 20px;
		margin-bottom: 20px;
	}

}



/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {

	/* 上にマージンを空ける
	----------------------------------------------- */
	.top_long {
		margin-top: 16vw;
	}
	.top_middle {
		margin-top: 12vw;
	}
	.top_short {
		margin-top: 8vw;
	}
	.top_vshort {
		margin-top: 4vw;
	}

	/* 下にマージンを空ける
	----------------------------------------------- */
	.bottom_long {
		margin-bottom: 16vw;
	}
	.bottom_middle {
		margin-bottom: 12vw;
	}
	.bottom_short {
		margin-bottom: 8vw;
	}
	.bottom_vshort {
		margin-bottom: 4vw;
	}

	/* 両方にマージンを空ける
	----------------------------------------------- */
	.both_long {
		margin-top: 16vw;
		margin-bottom: 16vw;
	}
	.both_middle {
		margin-top: 12vw;
		margin-bottom: 12vw;
	}
	.both_short {
		margin-top: 8vw;
		margin-bottom: 8vw;
	}
	.both_vshort {
		margin-top: 4vw;
		margin-bottom: 4vw;
	}

}




/* ================================================================================

	パディングボックス

================================================================================ */


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row_long {
		padding-top: 120px;
		padding-bottom: 120px;
	}
	.row_middle {
		padding-top: 80px;
		padding-bottom: 80px;
	}
	.row_short {
		padding-top: 40px;
		padding-bottom: 40px;
	}
	.row_vshort {
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.row_grid {
		position: relative;
		background: url(../img/bg_grid.jpg) center top -1px / auto 12px repeat;
	}
	.row_blue {
		position: relative;
		background: #edf1f6;
	}

	.box_border {
		padding: 40px;
		border: 8px solid #edf1f6;
	}
	.box_border2 img {
		border: 8px solid #edf1f6;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row_long {
		padding-top: 16vw;
		padding-bottom: 16vw;
	}
	.row_middle {
		padding-top: 12vw;
		padding-bottom: 12vw;
	}
	.row_short {
		padding-top: 8vw;
		padding-bottom: 8vw;
	}
	.row_vshort {
		padding-top: 4vw;
		padding-bottom: 4vw;
	}

	.row_grid {
		position: relative;
		background: url(../img/bg_grid.jpg) center top -1px / auto 12px repeat;
		padding-left: 4vw;
		padding-right: 4vw;
	}
	.row_grid.row_grid2 {
		padding-left: 0;
		padding-right: 0;
	}
	.row_blue {
		position: relative;
		background: #edf1f6;
		padding-left: 4vw;
		padding-right: 4vw;
	}

	.box_border {
		padding: 6vw;
		border: 2vw solid #edf1f6;
	}
	.box_border2 img {
		border: 2vw solid #edf1f6;
	}
}





/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★

	ここからコンテンツ内容

★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */



/* ================================================================================

	お知らせ

================================================================================ */


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row01{
		padding: 0 0 103px;
	}
	.row01 .post_wrap ul li{
		font-size: 0;
		letter-spacing: -0.4em;
		text-align: left;
		border-bottom: 1px solid #f3af88;
		padding: 10px 0 18px;
		margin: 0 0 12px;
		width: 100%;
	}
	.row01 .post_wrap ul li div{
		display: inline-block;
		vertical-align: middle;
		font-size: 16px;
		letter-spacing: 0;
		line-height: 1;
	}
	/* scroll */
	.row01 .scrollbar {
		overflow-x: hidden;
		overflow-y: auto;
		height: 270px;
	}
	
	/* 日付 */
	.row01 .post_wrap ul li div.post_date{
		width: 15%;
		letter-spacing: 0.15em;
		padding: 0 0 0 17px;
		font-size: 16px;
	}
	/* カテゴリー */
	.row01 .post_wrap ul li div.post_icon_box {
		width: 15%;
		font-size: 16px;
		letter-spacing: 0.14em;
		text-indent: 0.14em;
		text-align: center;
		padding: 0 28px 0 0;
	}
	.row01 .cate_advisor_list{
		display: block;
		background-color: #1e4b9f;
		color: #ffffff;
		padding: 6px 0;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	.row01 .cate_news_list{
		display: block;
		background-color: #ec661b;
		color: #ffffff;
		padding: 6px 0;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	/* テキスト */
	.row01 .post_wrap ul li div.post_title{
		width: 70%;
	}
	.row01 .post_title a{
		font-size: 16px;
		letter-spacing: 0.08em;
		color:#000000;
		display:block;
		width: 702px;
		overflow: hidden;
		line-height: 1.4;
		text-overflow: ellipsis;
		-webkit-text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
	}

	/* ボタン */
	.row01 .link-botan{
		background: url(../img/char00.png) center top / 350px auto no-repeat;
		text-align: center;
		height: 255px;
		padding-top: 189px;
		margin-top: 4px;
		image-rendering: -webkit-optimize-contrast;
	}
	.row01 .link-botan a{
		position: relative;
		background: #ec661b;
		color: #fff;
		font-size: 18px;
		letter-spacing: 0.08em;
		padding: 13px 0 12px;
		width: 303px;
		display: block;
		margin: 0 auto;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	.row01 .link-botan a::before{
		position: absolute;
		content: '';
		background: url(../img/link_icon.png)no-repeat center top / 100% auto;
		width: 17px;
		height: 17px;
		top: 50%;
		margin-top: -8px;
		right: 10px;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row01{
		padding: 0 0 5em;
	}
	.row01 .post_wrap ul li{
		font-size: 0;
		text-align: left;
		border-bottom: 1px solid #f3af88;
		padding: 2vw 3vw 3vw;
		margin: 0 0 4vw;
	}
	.row01 .post_wrap ul li div{
		display: inline-block;
		vertical-align: middle;
		font-size: 16px;
		letter-spacing: 0;
		line-height: 1;
	}
	/* scroll */
	.row01 .scrollbar {
		overflow-x: hidden;
		overflow-y: auto;
		height: 77vw;
		padding: 3vw;
	}
	
	/* 日付 */
	.row01 .post_wrap ul li div.post_date{
		letter-spacing: 0.15em;
		font-size: 3vw;
	}
	/* カテゴリー */
	.row01 .post_wrap ul li div.post_icon_box{
		font-size: 3vw;
		letter-spacing: 0.14em;
		text-indent: 0.14em;
		padding: 0 3vw;
	}
	.row01 .cate_advisor_list{
		background-color: #1e4b9f;
		color: #ffffff;
		padding: 1vw 2vw 1vw;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	.row01 .cate_news_list{
		background-color: #ec661b;
		color: #ffffff;
		padding: 1vw 2vw 1vw;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	/* テキスト */
	.row01 .post_wrap ul li div.post_title{
		display: block;
		margin-top: 2vw;
		margin-bottom: 2vw;
	}
	.row01 .post_title a{
		font-size: 4vw;
		letter-spacing: 0.08em;
		color: #000000;
		display: block;
		line-height: 1.4;
		padding: 2.5vw 0 0;
		overflow: hidden;
	}

	/* ボタン */
	.row01 .link-botan {
		background: url(../img/char00.png) center top / 76vw auto no-repeat;
		text-align: center;
		height: 58vw;
		padding-top: 41vw;
		margin-top: 2vw;
	}
	.row01 .link-botan a{
		position: relative;
		background: #ec661b;
		color: #fff;
		font-size: 4.8vw;
		letter-spacing: 0.08em;
		padding: 0.8em 0 0.9em;
		width: 81vw;
		display: block;
		margin: 0 auto;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	.row01 .link-botan a::before{
		position: absolute;
		content: '';
		background: url(../img/link_icon.png)no-repeat center top / 100% auto;
		width: 4.6vw;
		height: 4.6vw;
		top: 50%;
		margin-top: -2.3vw;
		right: 3vw;
	}
}


/* ================================================================================

	事例紹介一覧

================================================================================ */

/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	
	/* スライダー設定 */
	.row02-slider {
		height:643px;
	}
	.row02-slider .slick-list {
		padding-bottom: 20px !important;
	}
	.row02-slider .wpsisac-slick-carousal .wpsisac-image-slide {
		margin: 0 20px !important;
		box-shadow: 0 10px 15px -10px rgba(0,0,0,0.4);
	}
	.row02-slider .wpsisac-slick-carousal.design-6 .slick-dots {
		position: absolute;
		bottom: -36px !important;
	}



	.row02{
		padding: 40px 0 116px;
	}
	
	/* ボタン */
	.row02 .link-botan{
		text-align: center;
	}
	.row02 .link-botan a{
		position: relative;
		background: #ec661b;
		color: #fff;
		font-size: 18px;
		letter-spacing: 0.08em;
		padding: 13px 0 12px;
		width: 303px;
		display: block;
		margin: 0 auto;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	.row02 .link-botan a::before{
		position: absolute;
		content: '';
		background: url(../img/link_icon.png)no-repeat center top / 100% auto;
		width: 17px;
		height: 17px;
		top: 50%;
		margin-top: -8px;
		right: 10px;
	}
}



/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {

	.row02{
		padding: 0 0 6em;
	}
	/* ボタン */
	.row02 .link-botan{
		text-align: center;
	}
	.row02 .link-botan a{
		position: relative;
		background: #ec661b;
		color: #fff;
		font-size: 4.8vw;
		letter-spacing: 0.08em;
		padding: 0.8em 0 0.9em;
		width: 81vw;
		display: block;
		margin: 0 auto;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	.row02 .link-botan a::before{
		position: absolute;
		content: '';
		background: url(../img/link_icon.png)no-repeat center top / 100% auto;
		width: 4.6vw;
		height: 4.6vw;
		top: 50%;
		margin-top: -2.3vw;
		right: 3vw;
	}
}



/* ================================================================================

	主要取引先

================================================================================ */


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row03{
		position:relative;
		background: url(../img/bg_grid.jpg) center top -1px / auto 12px repeat;
		padding: 125px 0 100px;
	}
	/* ロゴスライダー設定 */
	.row03 .logo-slider{
		background:#ffffff;
		border-top:1px solid #f3af88;
		border-bottom:1px solid #f3af88;
		padding: 43px 0;
	}
	/* テキスト */
	.row03_text{
		color:#393939;
		width: 1000px !important;
		padding: 11px 0 50px;
		margin:0 auto;
	}
	/* バナースライダー設定 */
	.row03-01{
		position:relative;
		padding: 35px 0 0;
	}
	/*
	.row03-01{
		position:relative;
		padding: 35px 0 0;
		height: 324px;
	}
	.row03-01 .wpsisac-slick-carousal .wpsisac-image-slide {
		margin: 0 0.7vw;
		width: 25.2vw;
	}
	.row03-01 .wpsisac-slick-carousal .slick-dots li {
		margin: 14px 5px 0 !important;
	}
	.row03-01 .wpsisac-slick-carousal .slick-dots{
		position: absolute;
		top:174px;
	}
	*/


	.row03 a {
		transition-property: filter;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.row03 a:hover {
		opacity: 1;
		filter: brightness(110%);
	}

	/* h3見出し */
	.h3_top {
		position: relative;
		text-align: center;
	}
	.h3_top h3 {
		display: flex;
		align-items: center;
		font-size: 28px;
		color: #000000;
		font-weight: 400;
		letter-spacing: 0.05em;
		text-indent: 0.05em;
		line-height: 1.4 !important;
	}
	.h3_top h3:before,
	.h3_top h3:after {
		content: "";
		flex-grow: 1;
		height: 1px;
		background: #000000;
		display: block;
	}
	.h3_top h3:before {
		margin-right: 0.8em;
	}
	.h3_top h3:after {
		margin-left: 0.8em;
	}


	/* キャラクターバナー */
	.char01 a {
		position: relative;
	}
	.char01 a::before {
		position: absolute;
		content: "";
		display: block;
		background: url(../img/char01.png) center top / contain no-repeat;
		width: 220px;
		height: 132px;
		top: -120px;
		right: 20px;
		pointer-events: none;
	}

	.char02 a {
		position: relative;
	}
	.char02 a::before {
		position: absolute;
		content: "";
		display: block;
		background: url(../img/char02.png) center top / contain no-repeat;
		width: 173px;
		height: 132px;
		top: -120px;
		left: 10px;
		pointer-events: none;
	}

	.char03 a {
		position: relative;
		pointer-events: none;
	}
	.char03 a::before {
		position: absolute;
		content: "";
		display: block;
		background: url(../img/char03.png) center top / contain no-repeat;
		width: 183px;
		height: 231px;
		top: -211px;
		right: 30px;
		pointer-events: none;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row03{
		position:relative;
		background: url(../img/bg_grid.jpg) center top -1px / auto 12px repeat;
		padding: 6em 0;
	}
	
	/* ロゴスライダー設定 */
	.row03 .logo-slider{
		background:#ffffff;
		border-top:1px solid #f3af88;
		border-bottom:1px solid #f3af88;
		padding: 1em 0 0;
	}
	/* テキスト */
	.row03_text{
		color:#393939;
		padding: 1em 1em 2em 0;

	}


	/* バナースライダー設定 */
	.row03-01{
		position:relative;
		padding: 1em 1em 0;
	}
	/*
	.row03-01 .wpsisac-slick-carousal .wpsisac-image-slide {
		margin: 0 13.7vw;
	}
	*/

	.row03 a {
		transition-property: filter;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.row03 a:hover {
		opacity: 1;
		filter: brightness(110%);
	}


	/* h3見出し */
	.h3_top {
		position: relative;
		background: url(../img/title_bg03.png) no-repeat center bottom / auto 1.4vw;
		text-align: center;
		padding: 0 0 4vw 0;
	}
	.h3_top h3 {
		display: flex;
		align-items: center;
		color: #000000;
		font-size: 5vw;
		font-weight: 400;
		letter-spacing: 0.05em;
		text-indent: 0.05em;
		line-height: 1.1 !important;
	}
	.h3_top h3:before,
	.h3_top h3:after {
		content: "";
		flex-grow: 1;
		height: 1px;
		background: #000000;
		display: block;
	}
	.h3_top h3:before {
		margin-right: 1.5em;
	}
	.h3_top h3:after {
		margin-left: 1.5em;
	}


	/* キャラクターバナー */
	.char01 a {
		position: relative;
	}
	.char01 a::before {
		position: absolute;
		content: "";
		display: block;
		background: url(../img/char01.png) center top / contain no-repeat;
		width: 30vw;
		height: 17vw;
		top: -15.5vw;
		right: 2vw;
		pointer-events: none;
	}

	.char02 a {
		position: relative;
	}
	.char02 a::before {
		position: absolute;
		content: "";
		display: block;
		background: url(../img/char02.png) center top / contain no-repeat;
		width: 22vw;
		height: 18vw;
		top: -15.2vw;
		left: 2vw;
		pointer-events: none;
	}

	.char03 a {
		position: relative;
		pointer-events: none;
	}
	.char03 a::before {
		position: absolute;
		content: "";
		display: block;
		background: url(../img/char03.png) center top / contain no-repeat;
		width: 24vw;
		height: 32vw;
		top: -29.5vw;
		right: 5vw;
		pointer-events: none;
	}
}





/* ================================================================================

	会社概要/この道のプロが指南する

================================================================================ */


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row04{
		background: ;
		padding: 118px 0;
	}
	.row05{
		background: #ffedcd;
		padding: 125px 0;
	}
	
	/* テキスト */
	.row04_text,
	.row05_text{
		padding: 0 0 37px 47px;
		line-height: 2.2;
		letter-spacing: 0.01em;
		font-size: 16px;
	}
	/* ボタン */
	.row04 .link-botan,
	.row05 .link-botan{
		text-align: center;
	}
	.row04 .link-botan a,
	.row05 .link-botan a{
		position: relative;
		background: #ec661b;
		font-size: 18px;
		color: #fff;
		letter-spacing: 0.08em;
		padding: 13px 0 12px;
		width: 303px;
		display: block;
		margin-left: auto;
		margin-right: 0;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	.row04 .link-botan a::before,
	.row05 .link-botan a::before{
		position: absolute;
		content: '';
		background: url(../img/link_icon.png)no-repeat center top / 100% auto;
		width: 17px;
		height: 17px;
		top: 50%;
		margin-top: -8px;
		right: 10px;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	
	.row04{
		background: ;
		padding: 6em 0;
	}
	.row05{
		background: #ffedcd;
		padding: 6em 0;
	}
	
	/* テキスト */
	.row04_text,
	.row05_text{
		padding: 0 1em 2em;
	}
	/* ボタン */
	.row04 .link-botan,
	.row05 .link-botan{
		text-align: center;
	}
	.row04 .link-botan a,
	.row05 .link-botan a{
		position: relative;
		background: #ec661b;
		color: #fff;
		font-size: 4.8vw;
		letter-spacing: 0.08em;
		padding: 0.8em 0 0.9em;
		width: 81vw;
		display: block;
		margin: 0 auto;
		border-radius: 3px;		/* CSS3草案 */  
		-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */  
		-moz-border-radius: 3px;/* Firefox用 */
	}
	.row04 .link-botan a::before,
	.row05 .link-botan a::before {
		position: absolute;
		content: '';
		background: url(../img/link_icon.png)no-repeat center top / 100% auto;
		width: 4.6vw;
		height: 4.6vw;
		top: 50%;
		margin-top: -2.3vw;
		right: 3vw;
	}
}





/* ================================================================================

	ふろビト

================================================================================ */


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row06{
		position:relative;
		background: url(../img/bg_grid.jpg) center top -1px / auto 12px repeat;
		padding: 115px 0;
	}


	.row06 a {
		transition-property: filter;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.row06 a:hover {
		opacity: 1;
		filter: brightness(105%);
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row06{
		position:relative;
		background: url(../img/bg_grid.jpg) center top -1px / auto 12px repeat;
		padding: 3em 1em;
	}


	.row06 a {
		transition-property: filter;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.row06 a:hover {
		opacity: 1;
		filter: brightness(105%);
	}
}