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

/*
1.デフォルト
2.モジュール
3.トップ
4.
*/

/*------------------------------------
1.デフォルト
------------------------------------*/
.pc_none{display:none}
.sp_none{display:block}
@media screen and (max-width:959px) {
	.pc_none{display:block}
	.sp_none{display:none}
}
.txt_ctr{text-align: center !important}
.bold{font-weight: bold}

/*------------------------------------
2.モジュール
------------------------------------*/
/*タイトルバー*/
.ttl_01{
	margin-bottom: 30px;
	font-family: "Times New Roman", Times, serif;
	font-size: 30px;
	font-weight: bold;
}
@media screen and (max-width:959px) {
	.ttl_01{
		font-size: 28px
	}
}
.ttl_02{
	margin: 0 0 35px 0;
	padding: 10px 0 15px;
	font-size: 30px;
	text-align: center;
	position: relative
}
.ttl_02:before {
	width: 150px;
	height: 5px;
	position: absolute;
	bottom: 0;
	left: calc(50% - 75px);
	background: #0F1A38;
	content: ''
}
@media screen and (max-width:959px) {
	.ttl_02{
		font-size: 28px
	}
}

.btn_01{
	width: 280px;
	padding: 10px 0;
	color: #fff;
	text-align: center;
	background-color: #0F1A38;
	display: block;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/*ボタン*/
.btn_01:link{color: #fff;text-decoration: none}
.btn_01:visited{color: #fff;text-decoration: none}
.btn_01:hover{color: #fff;text-decoration: none;opacity: .7}
.btn_01:active{color: #fff;text-decoration: none}

/*パンリスト*/
.pan_list{margin:0 auto 30px;padding:10px 0;list-style-type:none;}
.pan_list li{padding-right:7px;font-size:13px;display:inline}
.pan_list li a{padding-right:12px;background:url(//sugiyasu-uogashi.com/wp_2021/wp-content/uploads/topic_path.gif) no-repeat right}
.pan_list li a:link{color:#0F1A38}
.pan_list li a:visited{color:#0F1A38}
.pan_list li a:hover{color:#0F1A38;text-decoration:none}
.pan_list li a:active{color:#0F1A38}

/*下層メインビジュアル*/
.under_mv{
	width: 950px;
	margin: 0 auto 10px
}
@media screen and (max-width:959px) {
	.under_mv{
		width: 100%
	}
	.under_mv img{
		width: 100%
	}
}

/*ボタン*/
.btn_01{
	width: 280px;
	margin: 0 auto 50px;
	padding: 8px 0;
	font-size: 15px;
	text-align: center;
	border-radius: 2px;
	display: block;
	clear: both;
}
.btn_01:link{color:#fff;text-decoration: none}
.btn_01:visited{color:#fff;text-decoration: none}
.btn_01:hover{
	filter: alpha(opacity=70);
	-moz-opacity: .7;
	opacity: .7
}
.btn_01:active{color:#fff;text-decoration: none}

/*テーブル*/
.table_01{
	width: 100%;
	margin: 0 auto 50px;
	border-collapse: collapse
}
.table_01 tr:nth-child(even){
	background-color: #fafafa;
}
.table_01 th {
	width:25%;
	padding: 15px 10px;
	line-height: 2.2em;
	text-align: left;
	vertical-align: top;
	border-bottom: solid 1px #0F1A38
}
.table_01 td {
	padding: 15px 10px;
	line-height: 2.2em;
	text-align: left;
	vertical-align: top;
	border-bottom: solid 2px #eee
}
@media screen and (max-width:959px) {
	.table_01 th{
		background-color: #efefef
	}
	.table_01 th,.table_01 td {
		width:100%;
		padding: 10px;
		font-size: 15px;
		border-bottom: solid 1px #ddd;
		display: block
	}
	.table_01 td {
		background-color: #fff
	}
}
.table_02{
	width: 100%;
	margin-bottom: 30px
}
.table_02 th{
	padding: 10px 5px;
	color: #fff;
	text-align: center;
	background-color: #0F1A38;
}
.table_02 td{
	padding: 10px 5px;
	text-align: center;
	border: 1px solid #ddd;
}
/*------------------------------------
3.トップ
------------------------------------*/
.mv_top_area{
	position: relative
}
.mv_top_area .area_txt{
	position: absolute;
	bottom: 300px;
	left: 2%;
	z-index: 100
}
.mv_top_area .area_txt .en{
	font-family: "Times New Roman", Times, serif;
	font-size: 40px;
	font-weight: bold;
	line-height: 1.5
}
.mv_top_area .area_txt .en span{
	padding: 5px 30px;
	background-color: #fff
}
.mv_top_area .area_txt .ja{
	padding: 5px 30px;
	font-size: 16px;
	font-weight: bold;
	background-color: #fff;
	display: inline-block
}
@media screen and (max-width:959px) {
	.mv_top_area{
		margin-bottom: 60%;
		position: relative
	}
	.mv_top_area .area_txt{
		position: absolute;
		bottom: 60%;
		left: 2%;
		z-index: 100
	}
	.mv_top_area .area_txt .en{
		font-size: 20px;
		line-height: 1.9
	}
	.mv_top_area .area_txt .en span{
		padding: 5px 15px
	}
	.mv_top_area .area_txt .ja{
		padding: 5px 10px;
		font-size: 14px
	}
}
@media screen and (max-width:320px) {
	.mv_top_area .area_txt .en{
		font-size: 18px;
		line-height: 1.9
	}
	.mv_top_area .area_txt .en span{
		padding: 5px 10px
	}
	.mv_top_area .area_txt .ja{
		padding: 5px 10px;
		font-size: 14px
	}
}
#loopslider {
    margin: 0 auto;
    width: 100%;
	height: 700px;
    text-align: left;
    position: relative;
	top: 0;
    overflow: hidden
}
#loopslider ul {
	width: 100%;
    height: 100%;
    float: left;
    display: inline;
    overflow: hidden
}
 
#loopslider ul li {
    float: left;
    display: inline;
    overflow: hidden
}
#loopslider ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden
}
#loopslider ul {
    display: inline-block;
    overflow: hidden
}
#loopslider li {
  position: relative;
  overflow: hidden
}
#loopslider li img{
	max-width: 100%;
	max-height: 100%
}
@media screen and (max-width:959px) {
	#loopslider {
		margin: 0 auto -500px;
		width: 100%;
		height: 580px
	}
	#loopslider li img{
		margin-left: 20px
	}
}
@media screen and (min-width: 1024px) {
  #loopslider li {
    width: 800px;
    height: 624px
  }
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
  #loopslider li {
    width: 800px;
    height: 624px
  }
}

@media screen and (max-width: 560px) {
	#loopslider li {
		width: 315px;
		height: 320px
	}
}
@media screen and (max-width: 320px) {
	#loopslider {
		margin: 0 auto -480px
	}
	#loopslider li {
		width: 315px;
		height: 320px
	}
}
.mod_top_01{
	margin-bottom: 50px;
	position: relative;
}
.mod_top_01 .youtube{
	width: 560px;
	float: left;
	position: relative;
	z-index: 3
}
.mod_top_01 .youtube p{
	text-align: center
}
.mod_top_01 .txt{
	width: 580px;
	height: 464px;
	float: right;
	margin: 0 0 0 40px;
	position: relative;
	z-index: 2
}
.mod_top_01 .txt .ttl_01{
	margin-bottom: 15px !important;
	padding: 5px 10px;
	background-color: rgba(255,255,255,.4);
}
.mod_top_01 .txt p{
	margin-bottom: 10px;
	padding: 5px 10px;
	font-size: 17px;
	line-height: 2;
	background-color: rgba(255,255,255,.4);
	display: inline-block
}
.mod_top_01 .btn_01{
	margin: 15px auto 0
}
.mod_top_01 .bg{
	width: 535px;
	height: 464px;
	position: absolute;
	right:180px;
	top: 0;
    background: url(//sugiyasu-uogashi.com/wp_2021/wp-content/uploads/bg_01.png) no-repeat;
	z-index: 1
}
@media screen and (max-width:959px) {
	.mod_top_01 .youtube{
		width: 80%;
		margin: 0 auto;
		float: none;
		position: static;
		z-index: 3
	}
	.mod_top_01 .youtube iframe{
		width: 100%
	}
	.mod_top_01 .youtube p{
		margin-bottom: 20px;
		font-size: 13px
	}
	.mod_top_01 .txt{
		width: 100%;
		height: auto;
		float: right;
		margin: 0 0 0 40px;
		position: relative;
		z-index: 2
	}
	.mod_top_01 .btn_01{
		margin: 15px auto 40px
	}
	.mod_top_01 .bg{
		display: none
	}
}
/*ネットショップ案内*/
.mod_top_02{
	margin: -15px auto 0;
	clear: both
}
.mod_top_02 .ttl_01{
	text-align: center
}
.mod_top_02 .txt_01{
	margin-bottom: 35px;
	text-align: center;
	line-height: 2
}
.mod_top_02 .btn_01{
	margin: 0 auto 70px;
	display: block
}
@media screen and (max-width:959px) {
	.mod_top_02{
		margin: 0 auto 0;
		clear: both
	}
	.mod_top_02 .ttl_01{
		text-align: center
	}
	.mod_top_02 .txt_01{
		margin-bottom: 35px;
		text-align: left
	}
	.mod_top_02 .btn_01{
		margin: 0 auto
	}
}
/*商品カテゴリ*/
.list_pro_cate_01{
	font-size: 0;
	overflow: hidden
}
.list_pro_cate_01 li{
	width: 48%;
	font-size: 0;
	background-color: #f4f4f4;
	border: 1px solid #ddd;
	box-sizing: border-box;
	display: inline-block;
	vertical-align: top;
	position: relative;
}
.list_pro_cate_01 li:nth-child(odd){
	margin: 0 4% 30px 0
}
.list_pro_cate_01 li a{
	display: block
}
.list_pro_cate_01 li a,.list_pro_cate_01 li a .ttl,.list_pro_cate_01 li a img{
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.list_pro_cate_01 li a:link .ttl{color: #000;text-decoration: none}
.list_pro_cate_01 li a:visited .ttl{color: #000;text-decoration: none}
.list_pro_cate_01 li a:hover .ttl{color: #0F1A38;text-decoration: none;filter:alpha(opacity=70);-moz-opacity: .7;opacity: .7}
.list_pro_cate_01 li a:active .ttl{color: #000;text-decoration: none}

.list_pro_cate_01 li a:link img{text-decoration: none}
.list_pro_cate_01 li a:visited img{text-decoration: none}
.list_pro_cate_01 li a:hover img{text-decoration: none;filter:alpha(opacity=70);-moz-opacity: .7;opacity: .7}
.list_pro_cate_01 li a:active imgl{text-decoration: none}
.list_pro_cate_01 li img{
	width: 30%;
	display: inline-block;
	vertical-align: middle
}
.list_pro_cate_01 li .ttl{
	width: 65%;
	margin: 10px 2.5%;
	display: inline-block;
	color: #1D2087;
	font-family: Georgia, 'Hiragino Mincho ProN', 'Yu Mincho', serif;
	font-size:25px;
	font-weight: bold;
	line-height: 1.3;
	vertical-align: middle
}

@media screen and (max-width:959px) {
	.list_pro_cate_01{
		margin-bottom: 10px;
		font-size: 0;
		overflow: hidden
	}
	.list_pro_cate_01 li{
		width: 100%;
		margin-bottom: 15px
	}
	.list_pro_cate_01 li:nth-child(odd){
		margin: 0 0 15px 0
	}
	.list_pro_cate_01 li:nth-child(3n+2){
		margin: 0 0 15px
	}
	.list_pro_cate_01 li img{
		width: 30%;
		display: inline-block;
		vertical-align: middle
	}
	.list_pro_cate_01 li .ttl{
		width: 65%;
		margin: 10px 2.5%;
		font-size:20px
	}
}
/*杉安挨拶*/
.mod_top_03{
	height: 420px;
	margin-bottom: 50px;
	padding: 45px 0 35px;
	position: relative;
	clear: both
}
.mod_top_03 .photo{
	width: 600px;
	float: left;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10
}
.mod_top_03 .photo img{
	max-width: 100%
}
.mod_top_03 .txt_area{
	width: 750px;
	height: 320px;
	margin-bottom: 50px;
	float: right;
	color: #fff;
	position: absolute;
	top:50px;
	right: 0;
	background-color: rgba(15,26,56,1);
	z-index: 9
}
.mod_top_03 .txt_area .box{
	width: 615px;
	margin: 50px 10px 50px 125px;
}
.mod_top_03 .bg{
	width: 540px;
	height: 476px;
	position: absolute;
	left:-250px;
	top: 30px;
    background: url(//sugiyasu-uogashi.com/wp_2021/wp-content/uploads/bg_02.png) no-repeat;
	z-index: 1
}
@media screen and (max-width:959px) {
	.mod_top_03{
		height: auto;
		margin-bottom:20px;
		padding: 45px 0 35px;
		position: static;
		clear: both
	}
	.mod_top_03 .photo{
		width: 100%;
		float: none;
		position: static;
		top: 0;
		left: 0;
		z-index: 10
	}
	.mod_top_03 .txt_area{
		width: 100%;
		height: auto;
		margin-bottom: 0;
		padding: 10px 0;
		float: none;
		position: static;
		top:0;
		right: 0;
		z-index: 9
	}
	.mod_top_03 .txt_area .box{
		width: 96%;
		margin: 20px 2%
	}
	.mod_top_03 .txt_area .box .ttl_01{
		font-size: 20px;
		line-height: 1.8
	}
	.mod_top_03 .bg{
		display: none
	}
}
/*こだわり商品*/
.mod_top_04{
	overflow: hidden;
	clear: both
}
.mod_top_04 .ttl_01{
	text-align: center
}
.mod_top_04 .txt_01{
	margin-bottom: 35px;
	text-align: center;
	line-height: 2
}
.pro_list_01{
	width: 95%;
	margin: 0 auto;
	font-size: 0
}
.pro_list_01 li{
	width: 19%;
	margin: 0 1.25% 50px 0;
	display: inline-block
}
.pro_list_01 li:last-child{
	margin: 0 0 50px 0
}
.pro_list_01 li a{
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
	display: block
}
.pro_list_01 li a:link{color: #000;text-decoration: none}
.pro_list_01 li a:visited{color: #000;text-decoration: none}
.pro_list_01 li a:hover{color: #000;text-decoration: none;opacity: .7}
.pro_list_01 li a:active{color: #000;text-decoration: none}
.pro_list_01 li img{
	max-width: 100%;
	display: block
}
.pro_list_01 li .con{
	padding: 10px;
	border: 1px solid #eee;
	border-top: none;
}
.pro_list_01 li .con .ttl{
	margin-bottom: 5px;
	font-family: "Times New Roman", Times, serif;
	font-size: 22px;
	font-weight: bold;
	text-align: center
}
.pro_list_01 li .con .txt{
	font-size: 14px
}
@media screen and (max-width:1600px) {
	.pro_list_01 li .con .ttl{
		font-size: 20px
	}
}
@media screen and (max-width:959px) {
	.pro_list_01 li{
		width: 100%;
		margin: 0 0 50px 0;
		display: block
	}
}
/*店舗紹介*/
.mod_top_05{
	overflow: hidden;
	clear: both
}
.mod_top_05 .ttl_01{
	text-align: center
}
.mod_top_05 .photo{
	width: 450px;
	float: left
}
.mod_top_05 .photo img{
	max-width: 100%
}
.mod_top_05 .con{
	width: 700px;
	float: right
}
.mod_top_05 .btn_01{
	margin: 0 auto 70px;
	display: block;
	clear: both
}
@media screen and (max-width:959px) {
	.mod_top_05 .photo{
		width: 100%;
		float: none
	}
	.mod_top_05 .photo img{
		max-width: 100%
	}
	.mod_top_05 .con{
		width: 100%;
		float: none
	}
}

/*------------------------------------
4.杉安について
------------------------------------*/
.mod_guide_01{
	margin-bottom: 50px;
	overflow: hidden
}
.mod_guide_01 .txt_area{
	width: 700px;
	float: left
}
.mod_guide_01 .txt_area p{
	margin-bottom: 10px;
	line-height: 1.8
}
.mod_guide_01 .photo{
	width: 450px;
	float: right
}
.mod_guide_01 .photo p{
	font-size: 18px;
	font-weight: bold
}
@media screen and (max-width:959px) {
	.mod_guide_01 .txt_area{
		width: 100%;
		margin-bottom: 15px;
		float: none
	}
	.mod_guide_01 .photo{
		width: 90%;
		margin: 0 auto;
		float: none
	}
	.mod_guide_01 .photo img{
		max-width: 100%
	}
}
.list_guide_01{
	font-size: 0
}
.list_guide_01 li{
	width: 300px;
	margin-bottom: 35px;
	display: inline-block
}
.list_guide_01 li:nth-child(odd){
	margin: 0 100px 35px 0
}
.list_guide_01 li img{
	max-width: 100%
}
.list_guide_01 li p{
	font-size: 20px;
	font-weight: bold
}
.mod_guide_03{
	margin-bottom: 35px;
	background-color: #eee;
}
.mod_guide_03 ul{
	padding: 28px 25px 20px
}
.mod_guide_03 li{
	margin-bottom: 8px;
	font-size: 15px;
	line-height: 1.8;
	display: block
}
.list_guide_02 {
	font-size: 0
}
.list_guide_02 li{
	width: 30%;
	margin-bottom: 30px;
	vertical-align: top;
	position: relative;
	display: inline-block
}
.list_guide_02 li:nth-child(3n+2){
	margin: 0 5% 30px
}
.list_guide_02 li img{
	max-width: 100%;
	position: relative
}
.list_guide_02 li .no{
	padding: 10px 15px;
	color: #fff;
	font-weight: bold;
	background-color: #e68103;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10
}
@media screen and (max-width:959px) {
.list_guide_01{
	font-size: 0
	}
	.list_guide_01 li{
		width: 90%;
		margin:0 auto 35px;
		display:block
	}
	.list_guide_01 li:nth-child(odd){
		margin: 0 auto 35px 
	}
	.list_guide_01 li img{
		max-width: 100%;
		margin: 0 auto 10px;
		display: block
	}
	.list_guide_01 li p{
		font-size: 18px
	}
	.mod_guide_03 ul{
		padding: 28px 10px 20px
	}
	.mod_guide_03 li{
		margin-bottom: 15px;
		font-size: 15px;
		line-height: 1.8;
		display: block
	}
	.list_guide_02 li{
		width: 100%;
		margin-bottom: 30px;
		display: block
	}
	.list_guide_02 li:nth-child(3n+2){
		margin: 0 0 30px
	}
}
/*------------------------------------
5.店舗紹介
------------------------------------*/
.mod_shop_01 .photo img{
	max-width: 100%
}
.google_map{height:0;margin-bottom:50px;padding:30px 0 56.25%;position:relative;overflow:hidden}
.google_map iframe,
.google_map object,
.google_map embed{width:100%;height:100%;position:absolute;top:0;left:0}

/*商品紹介*/
.mod_pro_01{
	margin-bottom: 50px
}
.mod_pro_01 img{
	max-width: 100%;
	margin:0 auto 30px;
	display: block
}
.mod_pro_01 p{
	margin-bottom: 15px;
	font-size: 16px;
	line-height: 2
}
.netshop_guide{
	margin-bottom: 30px;
    padding: 50px 0 50px;
    background: linear-gradient(
135deg
, #102C58 21px, #d9ecff 22px, #d9ecff 24px, transparent 24px, transparent 67px, #d9ecff 67px, #d9ecff 69px, transparent 69px), linear-gradient(
225deg
, #102C58 21px, #d9ecff 22px, #d9ecff 24px, transparent 24px, transparent 67px, #d9ecff 67px, #d9ecff 69px, transparent 69px)0 64px;
    background-color: #102C58;
    background-size: 64px 128px;
}
.netshop_guide a{
	width: 500px;
	margin: 0 auto;
    padding: 15px 0px 13px;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	background-color: #fff;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
	display: block
}
.netshop_guide a i{
	margin-right: 10px
}
.netshop_guide a:link{color: #0F1A38;text-decoration: none}
.netshop_guide a:visited{color: #0F1A38;text-decoration: none}
.netshop_guide a:hover{color: #0F1A38;text-decoration: none;opacity: .7}
.netshop_guide a:active{color: #0F1A38;text-decoration: none}
@media screen and (max-width:959px) {
	.netshop_guide a{
		width: 85%;
		padding: 15px 0 13px;
		font-size: 15px
	}
	.netshop_guide a i{
		margin-right: 5px
	}
}
.mod_pro_02 li{
	width: 48%;
	margin-bottom: 10px;
	display: inline-block
}
.mod_pro_02 li img{
	max-width: 100%
}
.mod_pro_02 p.txt_01{
	margin-bottom: 30px;
	text-align: center
}
@media screen and (max-width:959px) {
	.mod_pro_02 li{
		width: 100%;
		margin-bottom: 15px;
		display: block
	}
}
#lightgallery-default{
	width: 90%;
	max-width: 1980px;
	margin: 0 auto 50px;
	text-align: center;
	overflow: hidden;
	display: block
}
#lightgallery-default{
	margin: 0 auto 50px;
	font-size: 0
}
#lightgallery-default a{
	width: 19%;
	margin:0 1.25% 25px 0;
	float: left;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#lightgallery-default a:nth-child(5n+5){
	margin: 0 0 25px 0
}
#lightgallery-default a:link{color:#fff;text-decoration: none}
#lightgallery-default a:visited{color:#fff;text-decoration: none}
#lightgallery-default a:hover{color:#fff;text-decoration: none;opacity: .7}
#lightgallery-default a:active{color:#fff;text-decoration: none}
#lightgallery-default a img{
	max-width: 100%
}
#lightgallery-default a p{
	padding: 8px 0;
	background-color: rgb(15, 26, 56);
}
@media screen and (max-width:959px) {
	#lightgallery-default{
		width: 98%;
		max-width: 100%;
		margin:0 auto
	}
	#lightgallery-default a{
		width: 49%
	}
	#lightgallery-default a:nth-child(5n+5){
		margin: auto
	}
	#lightgallery-default a:nth-child(odd){
		margin:0 2% 25px 0
	}
	#lightgallery-default a:nth-child(even){
		margin:0 0 25px 0
	}

}

.mod_pro_04 img{
	max-width: 600px;
	margin: 0 auto 30px;
	display: block
}
.mod_pro_04 p{
	margin-bottom: 30px;
	text-align: center
}
@media screen and (max-width:959px) {
	.mod_pro_04 img{
		max-width: 90%;
		margin: 0 auto 30px;
	}
}
.mod_pro_05 {
	margin: 0 auto 100px;
	padding: 0;
}
.mod_pro_05 p.txt_01{
	width: 600px;
	margin: 0 auto 50px;
	line-height: 2
}
.flow {
width: 600px;
margin: 0 auto 30px;
	padding-left: 120px;
	position: relative;
	display: block
}
.flow::before {
	content: "";
	width: 15px;
	height: 100%;
	background: #eee;
	margin-left: -8px;
	display: block;
	position: absolute;
	top: 0;
	left: 120px;
}
.flow > li {
	position: relative;
}
.flow > li:not(:last-child) {
	margin-bottom: 8vh;
}
.flow > li .icon {
	font-size: 12px;
	color: #fff;
	background: #0F1A38;

	padding: 8px 20px;
	display: block;
	position: absolute;
	top: 0;
	left: -120px;
	z-index: 100;
}
.flow > li .icon::after {
	content: "";
	border-style: solid;
	border-width: 5px 0 5px 10px;
	border-color: transparent transparent transparent #0F1A38;
	position: absolute;
	top: 50%;
	left: 100%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.flow > li dl {
	padding-left: 70px;
	position: relative;
}
.flow > li dl::before,
.flow > li dl::after {
	content: "";
	display: block;
	position: absolute;
	top: 15px;
}
.flow > li dl::before {
	width: 7px;
	height: 7px;
	margin-top: -3px;
	background: #0F1A38;
	border-radius: 50%;
	left: -4px;
}
.flow > li dl::after {
	width: 50px;
	border-bottom: 1px dashed #999;
	position: absolute;
	left: 5px;
}
.flow > li dl dt {
	font-size: 20px;
	font-weight: 600;
	color: #0F1A38v;
	margin-bottom: 1vh;
}
@media screen and (max-width:959px) {
	.mod_pro_05 p.txt_01{
		width: 100%
	}
	.flow {
		width: 100%
	}
}
.mod_pro_06 ul{
	font-size: 0
}
.mod_pro_06 ul li{
	width: 30%;
	margin-bottom: 35px;
	display: inline-block
}
.mod_pro_06 ul li:nth-child(3n+2){
	margin: 0 5% 35px;
}
.mod_pro_06 ul li p.ttl{
	padding: 8px 0;
	color: #fff;
	text-align: center;
	background-color: #0F1A38;
}
.mod_pro_06 p.txt_01{
	margin-bottom: 30px;
	text-align: center;
}
.mod_pro_06 ul li img{
	max-width: 100%;
	margin: 0;
	padding: 0;
	display: block
}
@media screen and (max-width:959px) {
	.mod_pro_06 ul li{
		width: 48%;
		margin-bottom: 35px;
		vertical-align: top;
		display: inline-block
	}
	.mod_pro_06 ul li:nth-child(3n+2){
		margin: 0 0 35px
	}
	.mod_pro_06 ul li:nth-child(odd){
		margin: 0 4% 35px 0
	}
	.mod_pro_06 ul li p.ttl{
		padding: 8px 5px;
		font-size: 14px
	}
	.mod_pro_06 p.txt_01{
		text-align: left
	}
}