/* CSS Document */
/*
	layout.css
	ブラウザの癖のリセット用CSS
*/
@charset "utf-8";

/*margin,padding*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td {
	margin : 0;
	padding : 0;
}

/* a */
a, a:hover{
	overflow : hidden;
	outline : none;
	text-decoration: none;
}

/**/
h1, h2, h3, h4, h5, h6 {
	font-size : 100%;
}

/*ol,ul*/
ol, ul{
	list-style : none;
}

/*font-style,font-weight*/
address, caption, cite, code, dfn, em, strong, th, var {
	font-style : normal;
	font-weight : normal;
}

/*table cell*/
table {
	border-collapse : collapse; border-spacing : 0;
}

/*fieldset, img*/
fieldset, img {
	border : 0;
}

/*caption,th*/
caption, th {
	text-align : left;
}

/*q*/
q:before, q:after {
	content : '';
}

/* CSS Document */
/*
	base.css
	サイト全体のスタイル指定用
*/
@charset "utf-8";

body{
	background: #FFFFFF;
	font-family: "メイリオ","ＭＳ ゴシック", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", Helvetica, Arial, Verdana, sans-serif;
	min-width: auto !important;
}


/* media query viewSwitch
------------------------------------------------*/
@media screen and (min-width: 724px) {
	.mq-pc{ }
	.mq-sp{ display:none !important; }
}

@media screen and (max-width: 723px) {
	.mq-pc{ display:none !important; }
	.mq-sp{ }

}

.wrapper {
	margin : auto 0;
	padding : 0 auto;
	width:100%;
}
/*  --------------------------------------

横幅が724px以上スタート

--------------------------------------  */
/*@media screen and (min-width: 724px){*/
.content_wrap {
	margin: 0 auto;
	width: 100%;
	text-align:left;
}

/* --------------------  PC common */
.hide_text {
	height: 0;
	margin: 0;
	padding: 0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

/* --------------------  ヘッダー */
.h_wrap {
	position: relative;
	box-shadow: 0 1px 4px rgba(0,0,0,.3);

	margin:0 auto;
}
.h_logp {
	height: 105px;
	background-image: url(../img/logo_gifted.png);
	background-repeat:  no-repeat;
	background-position: left center;
	background-size: 110px auto;
	max-width: 1170px;
	margin: 0 auto;
}

.h_logp a {
	display:block;
	width:126px;
	height:100%;
	cursor:pointer;
	text-align:center;
	text-indent:-10000px;
}

.header_kv {
	display: block;
	/*
	display: flex;
	flex-flow: column;
	align-items: center;
	justify-content: center;
	*/
	margin : 0 auto;
	padding : 0;
	width: 100%;
	max-width : 1170px;
	/*height: 100%;*/
	height: 741px;
	background-image: url(../img/front_bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	text-align : left;
	position:relative;
}
.header_bg {
	position: relative;
	display: block;
	width: auto;
	height: auto;
	text-align: right;
	/*
	background-image: url(../img/front_pic.png);
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: center center;
	*/
}
.header_bg img{
	display: inline-block;
	width: 100%;
	height: auto;
	max-width: 1100px;
	margin-left: auto;
}
.header_txt {
	position: relative;
	padding:40px 35px;
	max-width:690px;
	width: calc(100% - 70px);
	height: auto;
	color:#FFF;
	font-size:20px;
	line-height:34px;
	background-color: rgba(0,0,0,0.7);
	margin: 20px auto;
}

.link_btn_01 {
	margin:20px auto 0 auto;
	width:292px;
}

.link_btn_01 a {
	background: url(../img/lp_btn_01.png);
	width:292px;
	height:46px;
	display: block;
	cursor:pointer;
	text-align:center;
	text-indent:-10000px;
}
.link_btn_01 a:hover{
	background-position:left bottom;
}

.link_btn_02 {
	margin: 40px auto 0px auto;
	width:224px;
}

.link_btn_02 a,
.link_btn_03 a {
	background: url(../img/lp_btn_02.jpg);
	width:224px;
	height:55px;
	display: block;
	cursor:pointer;
	text-align:center;
	text-indent:-10000px;
}
.link_btn_02 a:hover,
.link_btn_03 a:hover{
	background-position:left bottom;
}

.link_btn_03 {
	width:224px;
	position:absolute;
	top:1130px;
	left:235px;
}

/* --------------------  コンテンツ箇所 */

.cnt_01 {
	margin : 0 auto;
	padding: 0 auto;
	max-width: 1170px;
	position:relative;
	background-image: url(../img/c1_image_00.png);
	background-repeat: no-repeat;
	background-size: 360px 360px;
	background-position: right top;
}
.cnt_head {
	position: relative;
	max-width: 1170px;
	height: auto;
	width: 88%;
	text-align: center;
	padding: 20px 6% 0 6%;
	/* margin-bottom: 35px; */
}
.cnt_01 .cnt_head {

}
.cnt_head img {
	position: relative;
	display: inline-block;
	width: 80%;
	margin-right: 20%;
}
.cnt_body {
	position: relative;
	display: flex;
	align-items: flex-start;
	height: 100%;
}
.cnt_body_2 {
	position: relative;
}
.c_steps {
	position: relative;
	display: flex;
	width: 100%;
}
.c_steps > div {
	text-decoration: none;
	outline: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	line-height: 36px;
	color: white;
	padding: 0 10px 0 60px;
	background: rgba(211, 31, 26, 1);
	position: relative;
	width: 100%;
	height: 25%;
	padding: 0px 30px 0px 35px;
	line-height: 44px;
	box-sizing: border-box;
}
.c_steps_wrap {
	width: 100%;
}
.c_steps div:after {
	content: "";
	position: absolute;
	top: 0; 
	right: -22px;
	width: 44px; 
	height: 44px;
	transform: scale(0.707) rotate(45deg);
	z-index: 1;
	background: rgba(211, 31, 26, 1);
}
.c_steps div:nth-child(1),
.c_steps div:nth-child(1):after,
.steps_article ul li:nth-child(1) .c_steps div,
.steps_article ul li:nth-child(1) .c_steps div:after
 {
	background: rgba(236, 163, 166, 1);
}
.c_steps div:nth-child(2),
.c_steps div:nth-child(2):after,
.steps_article ul li:nth-child(2) .c_steps div,
.steps_article ul li:nth-child(2) .c_steps div:after {
	background: rgba(228, 119, 121, 1);
}
.c_steps div:nth-child(3),
.c_steps div:nth-child(3):after,
.steps_article ul li:nth-child(3) .c_steps div,
.steps_article ul li:nth-child(3) .c_steps div:after {
	background: rgba(219, 74, 75, 1);
}
.c_steps div:nth-child(4),
.c_steps div:nth-child(4):after,
.steps_article ul li:nth-child(4) .c_steps div,
.steps_article ul li:nth-child(4) .c_steps div:after {
	background: rgba(211, 31, 26, 1);
}

.c_steps div:last-child:after {
	content: none;
}
.c_steps div span {
	z-index: 7;
}
.c_steps div span:nth-child(1) {
	color: rgba(211, 31, 26, 1);
	background-color: rgba(255, 255, 255, 1);
	padding: 0px 15px;
	border-radius: 13px;
	height: 26px;
	line-height: 26px;
	font-size: 12px;
}
.c_steps div span:last-child {
	font-size: 20px;
}

.c_steps.vertical {
	max-width: 160px;
	min-width: 100px;
	flex-flow: column;
	/* height: 100vh; */
	height: 100%;
	margin-right: 25px;
	/* align-items: center; */
}
.c_steps.vertical div {
	width: 100%;
	flex-flow: column;
	min-height: 25%;
	height: 100%;
	padding: 35px 20px 35px 20px;
	/* align-items: center; */
}
.steps_article ul li:not(:last-child) .c_steps.vertical div:before {
	content: "";
	position: absolute;
	top: auto;
	left: 0;
	bottom: -18px; 
	width: 100%;
	height: 18px;
	transform: none;
	background:
      linear-gradient(to top right, rgba(255,255,255,0) 50%, rgba(236, 163, 166, 1) 50.5%) no-repeat top left/50% 100%,
      linear-gradient(to top left, rgba(255,255,255,0) 50%, rgba(236, 163, 166, 1) 50.5%) no-repeat top right/50% 100%;
	z-index: 10;
}
.steps_article ul li:nth-child(2) .c_steps.vertical div:before {
	background:
      linear-gradient(to top right, rgba(255,255,255,0) 50%, rgba(228, 119, 121, 1) 50.5%) no-repeat top left/50% 100%,
      linear-gradient(to top left, rgba(255,255,255,0) 50%, rgba(228, 119, 121, 1) 50.5%) no-repeat top right/50% 100%;
}
.steps_article ul li:nth-child(3) .c_steps.vertical div:before {
	background:
      linear-gradient(to top right, rgba(255,255,255,0) 50%, rgba(219, 74, 75, 1) 50.5%) no-repeat top left/50% 100%,
      linear-gradient(to top left, rgba(255,255,255,0) 50%, rgba(219, 74, 75, 1) 50.5%) no-repeat top right/50% 100%;
}
.steps_article ul li:nth-child(4) .c_steps.vertical div:before {
	background:
      linear-gradient(to top right, rgba(255,255,255,0) 50%, rgba(211, 31, 26, 1) 50.5%) no-repeat top left/50% 100%,
      linear-gradient(to top left, rgba(255,255,255,0) 50%, rgba(211, 31, 26, 1) 50.5%) no-repeat top right/50% 100%;
}
.lead_tx {
	position: relative;
	font-size:20px;
	line-height:34px;
	text-align: left;
	margin: 20px auto;
	width: 100%;
	padding-bottom: 35px;
}

.lead_tx span:after {
	content: "\A";
  	white-space: pre;
}
section[class*="col"] {
	width: 100%;
	position: relative;
}

.col_lists {
	width: 100%;
	display: flex;
	justify-content: center;
}
.col_lists li {
	width: calc(25% - 30px);
	padding: 0 15px;
	margin: 0 auto;
	text-align: center;
}
.col_lists li div {
	text-align: left;
}
.col_lists li img, .col_list_image {
	max-width: 256px;
	width: 100%;
	padding: 0px 0 20px 20px;
}
.article_wrap {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin: 20px 0 30px 0;
	width: 100%;
}
.steps_article {
	width: calc(100% - 30px);
	min-height: auto;
	padding: 0 0 0 30px;
}
.steps_article ul {
	display: -ms-flexbox;
  	display: flex;
  	flex-wrap: wrap;
}
.steps_article ul li {
	display: flex;
}
.article__txt {
	padding: 0;
	width: calc(100% - 256px);
}
.c01_tx00 h1 {font-weight:normal;}
/*
.c01_tx01 {left:20px;}
.c01_tx02 {left:310px;}
.c01_tx03 {left:600px;}
.c01_tx04 {left:895px;}
*/
.cnt_02 {
	margin : 0 auto;
	padding: 0 auto;
	max-width: 1170px;
	/* height:794px; */
	/* background: url(../img/cnt_img_02.jpg) no-repeat; */
	position: relative;
}

.cnt_03 {
	margin : 0 auto;
	padding: 0 auto;
	max-width: 1170px;
	height:1105px;
	background: url(../img/cnt_img_03.jpg) no-repeat;
	position:relative;
}

.c03_tx00 {
	width:760px;
	font-size:20px;
	line-height:37px;
	position:absolute;
	top:170px;
	left:260px;
}

.c03_tx01,
.c03_tx02,
.c03_tx03,
.c03_tx04 {
	width:630px;
	font-size:16px;
	line-height:26px;
	position:absolute;
	left:235px;
}
.c03_tx01 {top:387px;}
.c03_tx02 {top:576px;}
.c03_tx03 {top:730px;}
.c03_tx04 {top:933px;}

.c03_mds {
	margin:0 0 10px 0;
	font-size:21px;
	color:#d31f1a;
}

.cnt_04 {
	margin : 0 auto;
	padding: 0 auto;
	max-width: 1170px;
	height:1311px;
	background: url(../img/cnt_img_04.jpg) no-repeat;
	position:relative;
}
/*
.c04_tx01 {
	width:900px;
	font-size:25px;
	color:#d31f1a;
	line-height:25px;
	position:absolute;
	top:760px;
	left:74px;
}
*/
.col_text {
	font-size: 17px;
	width: 100%;
	white-space: wrap;
}

.col_title {
	position: relative;
	display: block;
	font-size: 35px;
	font-weight: 400;
	padding: 10px 10px 20px 10px;
	margin: 0 auto;
	text-align: center;
}
.col_title span {
	margin: 0 auto;
	padding: 0 10px;
	background: -webkit-linear-gradient(transparent 60%, #ffff66 60%);
	background: -o-linear-gradient(transparent 60%, #ffff66 60%);
	background: linear-gradient(transparent 60%, #ffff66 60%);
}
.col_title_red {
	font-weight: 300;
	font-size: 21px;
	color: rgba(211, 31, 26, 1);
}
.spread {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	width: 100%;
	margin: 20px 0;
}
.spread .half_content {
	position: relative;
	width: 50%;
	height: 100%;
	/*background-image: url(../img/customers_voices1.png);*/
	background-position: center center;
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
.half_content img {
	position: relative;
	width: 100%;
}
/*
.col_title {
	position: relative;
	display: inline-block;
	max-height: 60px;
	width: 100%;
	height: auto;
	background-image: url(col2_title.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
*/
.dot {
  	background-image: radial-gradient(#D8D8D8 20%, transparent 0), radial-gradient(#D8D8D8 20%, transparent 0);
  	background-position: 0 0, 5px 5px;
  	background-size: 10px 10px;
}
.cnt_wrap {
	position: relative;
	margin: 20px auto;
	padding: 50px 0px;
	width: calc(100% - 40px);
	max-width: 1170px;
}

.front_message {
	position: relative;
	width: 90%;
	max-width: 576px;
	margin: 0 auto;
}
.front_message img {

	width: 100%;
}

.c04_tx01 li {
	display: inline-block;
	vertical-align: middle;
}

.c04_intro {
	margin:0 0 0 40px;
	font-size:15px;
}

.customers_voices span {color:#d31f1a;}


.balloon_wrap {
	position: relative;
	border-width: 2px;
	border-color: rgba(211, 31, 26, 1);
	border-style: solid;
	padding: 90px 50px 60px 50px;
	border-radius: 20px;
	background-color: rgba(255, 255, 255, 1);
	margin: 0 20px 30px 20px;
    width: calc(100% - 150px);
}
.balloon_wrap:after {
	content: "";
	position: absolute;
	bottom: -33.5px;
	right: 100px;
	width: 65px;
	height:34px;
	background-image: url(../img/balloon_arrow.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: center center;
}
.balloon_wrap .spread .half_content:nth-child(1) {
	width: 60%;
}
.customers_voices {
	width: calc(60% - 35px);
	padding-right: 35px;
}
.balloon_wrap .spread .half_content:nth-child(2) {
	position: relative;
	width: 40%;
	margin-bottom:30px;
}
.balloon_wrap .spread .half_content:nth-child(2):before {
	content: "";
	position: absolute;
	top: 5px;
	left: 5px;
	width: 100%;
	height: calc(100% - 5px);
	background-color: rgba(211, 31, 26, 0.4);
}
.customers_name {
	padding: 20px 0 30px;
	color: rgba(211, 31, 26, 1);
}
.customers_name span:nth-child(1) {
	font-size: 25px;
}
.customers_name span:nth-child(2) {
	font-size: 15px;
	margin-left: 50px;
}
.ribbon_side {
	position: absolute;
	top: 20px;
	left: 0;
	display: inline-block;
  	box-sizing: border-box;
  	padding: 10px 45px;
  	margin: 0 0 0 -20px;
  	width: auto;
  	height: 54px;
  	font-size: 22px;
  	color: white;
  	background: rgba(211, 31, 26, 1);
}
.ribbon_side:before {
	position: absolute;
  	content: "";
  	top: 100%;
  	left: 0;
  	border: none;
  	border-bottom: solid 15px transparent;
  	border-right: solid 20px rgba(126, 31, 26, 1);
}
.ribbon_side:after {
	content: "";
	position: absolute;
	top: 0; 
	right: -27px;
	width: 54px; 
	height: 54px;
	transform: scale(0.707) rotate(45deg);
	z-index: 1;
	background: rgba(211, 31, 26, 1);
}

#contact {
	padding-top:130px !important;
	width: calc(100% - 80px) !important;
	height: auto !important;
	background: none;
	background-color: rgba(238, 238, 238, 1);
	padding: 60px 40px;
}
#contact.mq-sp {
	display: none;
}
.contact_wrap {
	width: calc(95% - 60px);
	max-width: 760px;
	height: auto;
	margin: 0px auto;
	border: 1px solid #312f2f;
	-moz-border-radius: 6px / 6px 6px 6px 6px;
	-webkit-border-radius: 6px / 6px 6px 6px 6px;
	border-radius: 6px / 6px 6px 6px 6px;
	padding: 30px 30px 20px 30px;
	font-size: 24px;
}
.contact_box .color-black {
	color: #312f2f;
	border: none;
}
.contact_wrap > p.center {
	font-size: 16px;
}
.footer_custom {
	width: calc(100% - 20px);
	padding-left: 20px;
	position: relative;
    height: 70px;
    background: #d32319;
}
.footer_custom > div {
	margin: 0 auto;
	max-width: 1170px;
}
.color-white {
	color: #fff;
}

.footer_custom .right {
	float: right;
    display: block;
}
.footer_custom ul {
    margin-top: 14px;
    margin-right: 60px;
}
.footer_custom .right .left {
	float: left;
    display: block;
    margin-left: 12px;
}
#footer_utility {
	width: 100%;
	height: auto;
}
#footer_utility > div {
	max-width: 1170px;
	display: flex;
	justify-content: flex-start;
	margin: 0 auto;
} 
.sns_section {
	position: relative;
	max-width: 270px;
	margin: 30px 20px 0 0;
	border-radius: 4px !important;
}
.sns_section.right {
	margin: 0px 20px 0 0;
}
.sns_section a {
	color: rgba(0,0,0,1);
}
#footer_utility .right {
	width: 100%;
	height: auto;
	border-right: 1px solid #d7d7d3;
	border-left: 1px solid #d7d7d3;
	background: #f7f9f8;
	margin-left: auto;
}

#footer_utility .right ul {
	margin: 70px 0 0 20px;
}

#footer_utility .right li {
	list-style: none;
	margin-bottom: 20px;
}
#footer_utility .right li:before {
	content: url(../img/footer_utility_list_arrow.png);
	margin-right: 12px;
}



/* ここまで */
/*}*/


/* --------------------  common */
.mb5 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb15 {margin-bottom:15px;}
.mb16 {margin-bottom:16px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb60 {margin-bottom:60px;}
.mb80 {margin-bottom:80px;}
.mb100 {margin-bottom:100px;}

.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}

.mr8 {margin-right:8px;}
.mr10 {margin-right:10px;}
.mr15 {margin-right:15px;}
.mr16 {margin-right:16px;}
.mr20 {margin-right:20px;}
.mr23 {margin-right:23px;}
.mr30 {margin-right:30px;}
.mr40 {margin-right:40px;}

.pt10 {padding-top:10px;}

.pb10 {padding-bottom:10px;}
.pb20 {padding-bottom:20px;}
.pb30 {padding-bottom:30px;}
.pb60 {padding-bottom:60px;}
.pb100 {padding-bottom:100px;}

.pl5 {padding-left:5px;}

/* size */
.w68 {width:680px;}
.w77 {width:770px;}

/* テキストリンク系＆カラー */
.red {color:#dd0000;}
.green {color:#bc0000;border-bottom:4px solid #ffff00;}

/* テキストインデント */
.ind {text-indent:-2em;padding-left:2em;}
.size11 {font-size:11px;line-height:15px;}


/* 回り込み回避用 */
br.clear{
	margin : 0;
	padding : 0;
	clear : both;
}
@media screen and (max-width: 960px) {
	.customers_name span:nth-child(2) {
		margin: 0;
	}
	.customers_name span:nth-child(1):after {
		content: "\A";
  		white-space: pre;
	}
	.customers_name span:nth-child(2):after {
		content: "\A";
  		white-space: pre;
	}
	.article_wrap {
		margin: 35px 0 40px 0;
	}
	.article_wrap .col_list_image {
		width: 212px;
	}
	.c_steps.vertical {
		width: 100px;
	}
	.c_steps.vertical div {
		padding: 35px 10px 35px 10px;
		justify-content: flex-start;
	}
	.steps_article {
		width: calc(100% - 30px);
   		min-height: auto;
    	padding: 0 10px 0 20px;
	}
}
@media screen and (max-width: 860px) {
	.cnt_body_2 {
		display: flex;
	}
 	.c_steps.horizontal {
		width: 100px;
		max-width: 160px;
		min-width: 100px;
		flex-flow: column;
		height: auto;
		padding: 0px 10px 0px 20px;
	}
	.c_steps.horizontal div {
		padding: 35px 10px 35px 10px;
		flex-flow: column;
		justify-content: flex-start;
		min-height: 25%;
    	height: 100%;

	}
	.c_steps.horizontal div:not(:nth-child(4)):before {
	content: "";
	position: absolute;
	top: auto;
	right: 0;
	bottom: -18px;
	width: 100%;
	height: 18px;
	transform: none;
	background:
      linear-gradient(to top right, rgba(255,255,255,0) 50%, rgba(236, 163, 166, 1) 50.5%) no-repeat top left/50% 100%,
      linear-gradient(to top left, rgba(255,255,255,0) 50%, rgba(236, 163, 166, 1) 50.5%) no-repeat top right/50% 100%;
	z-index: 10;
	}
	.c_steps.horizontal div:nth-child(2):before {
	background:
      linear-gradient(to top right, rgba(255,255,255,0) 50%, rgba(228, 119, 121, 1) 50.5%) no-repeat top left/50% 100%,
      linear-gradient(to top left, rgba(255,255,255,0) 50%, rgba(228, 119, 121, 1) 50.5%) no-repeat top right/50% 100%;
	}
	.c_steps.horizontal div:nth-child(3):before {
	background:
      linear-gradient(to top right, rgba(255,255,255,0) 50%, rgba(219, 74, 75, 1) 50.5%) no-repeat top left/50% 100%,
      linear-gradient(to top left, rgba(255,255,255,0) 50%, rgba(219, 74, 75, 1) 50.5%) no-repeat top right/50% 100%;
	}
	.c_steps div:after {
		display: none;
	}
	.c_steps.horizontal .col_list_image {
		padding: 0;
	}
	.col_lists {
		flex-flow: column;
	}
	.col_lists li {
		display: flex;
		flex-flow: row;
		width: calc(100% - 0px);
		padding: 0 0 20px 0px;

	}
	.col_lists li img {
		max-width: 140px;
		height: 107px;
		order: 0;
		padding: 0;
	}
	.lead_tx {
		font-size: 20px;
		line-height: 32px;
	}
	.lead_tx span:after {
		content: "";
		white-space: normal;
	}
	#footer_utility > div {
		flex-flow: column;
		justify-content: center;
	}
	.sns_section:not(.right) {
		display: none;
	}
	.sns_section {
		max-width: auto;
		max-width: auto !important;
		border: none !important;
		background: none !important;
		width: 100% !important;
		margin: 30px 20px 0 20px !important;
	}
	#footer_utility .right ul {
		margin: 0;
	}
}
@media screen and (max-width: 723px) {
	.h_logp {
		height: 64px;
	}
	.h_logp a {
		height: 64px;
	}
	.cnt_wrap {
	    padding: 30px 10px;
    	width: calc(100% - 20px);
    }
	.cnt_head {
    	width: calc(100% - 10px) !important;
    	margin: 0 auto 30px;
    	padding: 20px 5px 0 5px;
 	}
	.cnt_01 {
		background-size: 262px 262px;
	}
	.article_wrap {
		flex-flow: column;
	}
	.article_wrap .col_list_image {
		width: calc(100% - 20px);
		padding: 0 20px 0 0;
		max-width: 414px;
	}
	/*
	.c_steps > div {
	width: 100%;
	flex-flow: column;
	height: auto;
	min-height: 25%;
	padding: 15px 20px 15px 20px;
	}
	*/
	.article__txt {
		padding: 0;
	}

	.col_text {
		margin-bottom: 20px;
	}
	.front_message {
		width: 100%;
	}
	.spread {
		flex-flow: column;
	}
	.spread .half_content {
		width: 100%;
	}
	.balloon_wrap {
		width: calc(100% - 105px);
		padding: 90px 30px 40px 30px;
	}
	.balloon_wrap .spread .half_content:nth-child(1) {
		width: 100%;
		order: 1;
	}
	.balloon_wrap .spread .half_content:nth-child(2) {
		width: 100%;
		order: 0;
	}
	#contact {
		padding-top: 40px !important;
    	width: calc(100% - 40px) !important;
    	height: auto !important;
    	padding: 40px 20px;
	}
	#contact  h4 {
		margin: 20px 0;
	}
	.contact_box {
		margin: 20px 0;
	}
	.contact_box a.center {
		font-size: 20px;
		border-bottom: none;
		text-decoration: none;
    	outline: none;
	}
	.contact_box img {
		position: relative;
		top: 3px;
    	display: inline-block;
    	margin: 0 5px 0 0;
	}
	.footer_custom {
		width: 100%;
		height: 90px;
		padding: 0;
	}
	.footer_custom div small {
		display: block;
		width: 100%;
		text-align: center;
	}
	.article__txt {
		width: 100%;
	}
}
@media screen and (max-width: 580px) {
	.steps_article {
		width: 100%;
		padding: 0;
	}
	.col_lists li {
		flex-flow: column;
	}
	.c_steps.horizontal {
		padding: 0px 10px 0px 0px;
	}
	.c_steps.vertical {
		margin-right: 10px;
	}
	.col_title {
		font-size: 30px;
	}
	.cnt_head img {
		width: 100%;
		margin-right: 0;
	}
}
@media screen and (max-width: 414px) {
	.header_txt {
	}
	.link_btn_01 {
		text-align: center;
	}
	.link_btn_01 a {
		transform: scale(0.8);
	}
	.footer_custom {
		height: 155px;
	}
	.footer_custom > div {
		display: flex;
		flex-flow: column;

	}
	.footer_custom .right .left {
		margin-left: 2px;
		float: none;
	}
	.footer_custom > div .color-white {
		order: 2;
	}
	.footer_custom > div .right.to_top {
		order: 1;
		margin-bottom: 5px;
		margin-left: auto;
	}
	.footer_custom > div ul.right {
		display: flex;
		justify-content: space-around;
		margin-right: 0;
		margin-bottom: 10px;
		order: 0;

	}
}