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

/* ----------------------------------------------------------------------

 smart phone setting

---------------------------------------------------------------------- */

body {
	-webkit-text-size-adjust:100%;
	margin:0;
	padding:0;
	font-family:"Century Gothic", Arial, sans-serif;
	width:100%;
	position:relative;
	font-size:14px;
	color:#333;
	line-height:1.8;
}
/* layout */
#contents {
	width:100%;
}
#main_col {
	padding: 85px 15px 0px 15px;
}
#side_col {
	padding:30px 15px 0px;
	border-top:1px solid #ccc;
}
#index_top_wrap {
	width:100%;
	background:#f2f2f2;
	padding: 44px 0px 0px 0px;
}
#index_top {
	margin: 0;
	padding: 16px 0px 0px 0px;
}
/* headline */
.headline1 {
	border-bottom:1px solid #ddd;
	padding:0;
	margin:0 0 25px 0;
	font-size:16px;
	font-weight:bold;
}
.headline1 span {
	border-bottom:4px solid #ccc;
	padding:0 0 10px 0;
	margin:0;
	display:inline-block;
}
.main_banner img {
	width:100%;
}
.pc_main_img {
	display:none;
}
/* ----------------------------------------------------------------------
 company info
---------------------------------------------------------------------- */
#company_info {
	margin:0 0 50px 0;
	padding:1px 0 0 0;
}
#company_info p {
	margin:0;
}
#company_info dl {
	margin:0 0 40px 0;
}
#company_info dt {
	background:#f2f2f2;
	margin:0 0 5px 0;
	line-height:200%;
	font-weight:bold;
	font-size:12px;
	padding:0 10px;
}
#company_info dd {
	margin:0 0 10px 0;
	line-height:200%;
	padding:0 10px;
}
#company_map {
	text-align:right;
}
#company_map a {
	color:#333;
}
#company_map iframe {
	width:100%;
}
#company_map_desc {
	padding:20px 0 0;
}
/* ----------------------------------------------------------------------
 index
---------------------------------------------------------------------- */
/* slider */
#slider {
	z-index:1;
	margin:0 0 10px 0;
}
#slider img {
	width:100%;
	height:auto;
	display:block;
}
/* top banner */
#index_banner ol {
	margin:0;
	padding:0;
}
#index_banner ol li {
	list-style-type:none;
	padding:0;
	margin:0 0 10px 0;
}
#index_banner img {
	display:block;
	width:100%;
	height:auto;
}
/* news */
#index_news {
	position:relative;
}
#index_news ol {
	margin:0 0 15px 0;
	padding:0;
}
#index_news ol li {
	list-style-type:none;
	margin:0 0 2px 0;
	padding:10px;
	background:#f2f2f2;
	font-size:13px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
}
#index_news ol li .date {
	font-size:12px;
	margin:0 10px 0 0;
	line-height:100%;
	color:#999;
}
#index_news ol li .title {
	line-height:150%;
	padding:7px 0 0;
	margin:0;
}
#index_news ol li .title a {
	display:block;
	text-decoration:none;
}
/* archive link */
.index_archive_link a {
	position:absolute;
	right:0px;
	top:5px;
	font-size:11px;
	text-decoration:none;
}
.index_archive_link a:hover {
	text-decoration:underline;
}
/* index center banner */
#index_center_banner {
	display:block;
	margin:0 0 40px 0;
}
#index_center_banner img {
	width:100%;
	height:auto;
	display:block;
}
/* product */
#index_product {
	position:relative;
	margin:0 0 10px 0;
}
#index_product ol {
	margin:0;
	padding:0;
}
#index_product ol li {
	list-style-type:none;
	margin:0 0 20px 0;
	padding:0;
}
#index_product ol li .image {
	display:block;
	background:#fff;
}
#index_product ol li .image img {
	display:block;
	width:100%;
	height:auto;
	border:1px solid #ccc;
	-webkit-transition-property:opacity;
	-webkit-transition-duration:0.4s;
	-webkit-transition-timing-function:ease;
	-moz-transition-property:opacity;
	-moz-transition-duration:0.4s;
	-moz-transition-timing-function:ease;
	-o-transition-property:opacity;
	-o-transition-duration:0.4s;
	-o-transition-timing-function:ease;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
}
#index_product ol li .image:hover img {
	opacity:0.5;
}
#index_product ol li .category {
	background:#999;
	color:#fff;
	padding:0 10px;
	height:40px;
	line-height:40px;
	overflow:hidden;
	font-size:14px;
}
#index_product ol li .category a {
	text-decoration:none;
	color:#fff;
}
#index_product ol li .category a:hover {
	text-decoration:underline;
}
#index_product ol li .title {
	font-size:14px;
	margin:15px 0 10px;
}
#index_product ol li .title a {
	text-decoration:none;
}
#index_product ol li .desc {
	font-size:12px;
	margin:10px 0;
	line-height:160%;
}
/* blog */
#index_blog {
	position:relative;
	margin:0 0 40px 0;
}
#index_blog ol {
	margin:0;
	padding:0;
}
#index_blog ol li {
	list-style-type: none;
	margin: 0 0 2px 0;
	padding: 10px;
	background: #f2f2f2;
	font-size: 13px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
#index_blog ol li .image {
	float:left;
	margin:0 15px 0 0;
	background:#fff;
}
#index_blog ol li .image img {
	display:block;
	-webkit-transition-property:opacity;
	-webkit-transition-duration:0.4s;
	-webkit-transition-timing-function:ease;
	-moz-transition-property:opacity;
	-moz-transition-duration:0.4s;
	-moz-transition-timing-function:ease;
	-o-transition-property:opacity;
	-o-transition-duration:0.4s;
	-o-transition-timing-function:ease;
}
#index_blog ol li .image:hover img {
	opacity:0.5;
}
#index_blog ol li .date {
	margin:0;
	font-size:12px;
	color:#999;
}
#index_blog ol li .title {
	margin:0;
	font-size:14px;
}
#index_blog ol li .title a {
	text-decoration:none;
	font-weight:normal;
}
/* footer banner */
#footer_banner li {
	margin:0 0 15px 0;
}
#footer_banner li img {
	width:100%;
	height:auto;
	display:block;
}
/* ----------------------------------------------------------------------
 archive
---------------------------------------------------------------------- */
/* product */
#product_list {
	position:relative;
	margin:0 0 10px 0;
}
#product_list {
	margin:0;
	padding:0;
}
#product_list li {
	list-style-type:none;
	margin:0 0 20px 0;
	padding:0;
}
#product_list li .image {
	display:block;
	background:#fff;
}
#product_list li .image img {
	display:block;
	width:100%;
	height:auto;
	border:1px solid #ccc;
	-webkit-transition-property:opacity;
	-webkit-transition-duration:0.4s;
	-webkit-transition-timing-function:ease;
	-moz-transition-property:opacity;
	-moz-transition-duration:0.4s;
	-moz-transition-timing-function:ease;
	-o-transition-property:opacity;
	-o-transition-duration:0.4s;
	-o-transition-timing-function:ease;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
}
#product_list li .image:hover img {
	opacity:0.5;
}
#product_list li .title {
	font-size:14px;
	margin:0 0 10px 0;
}
#product_list li .title a {
	text-decoration:none;
	display:block;
	padding:10px;
	background:#999;
	color:#fff;
	height:40px;
	overflow:hidden;
	-webkit-transition-property:background;
	-webkit-transition-duration:0.4s;
	-webkit-transition-timing-function:ease;
	-moz-transition-property:background;
	-moz-transition-duration:0.4s;
	-moz-transition-timing-function:ease;
	-o-transition-property:background;
	-o-transition-duration:0.4s;
	-o-transition-timing-function:ease;
}
#product_list li .title a:hover {
	background:#333;
}
/* news */
#news_list {
	position:relative;
}
#news_list {
	margin:0 0 15px 0;
	padding:0;
}
#news_list li {
	list-style-type:none;
	margin:0 0 2px 0;
	padding:10px;
	background:#f2f2f2;
	font-size:13px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
}
#news_list li .date {
	font-size:12px;
	margin:0 10px 0 0;
	line-height:100%;
	color:#999;
}
#news_list li .title {
	line-height:150%;
	padding:7px 0 0;
	margin:0;
}
#news_list li .title a {
	display:block;
	text-decoration:none;
}
/* blog */
#post_list {
	margin:0;
	padding:0;
}
#post_list li {
	border-bottom:1px dotted #aaa;
	margin:0 0 25px 0;
	padding:0 0 15px 0;
}
#post_list .image {
	display:block;
	background:#fff;
	margin:0 0 15px 0;





}
#post_list .image img {
	display:block;
	width:100%;
	height:auto;
	-webkit-transition-property:opacity;
	-webkit-transition-duration:0.4s;
	-webkit-transition-timing-function:ease;
	-moz-transition-property:opacity;
	-moz-transition-duration:0.4s;
	-moz-transition-timing-function:ease;
	-o-transition-property:opacity;
	-o-transition-duration:0.4s;
	-o-transition-timing-function:ease;
}
#post_list .image:hover img {
	opacity:0.5
}
#post_list .info {
}
#post_list .no_thumbnail .info {
	float:none;
	width:auto;
}
#post_list .post_date {
	font-size:12px;
	width:54px;
	height:54px;
	text-align:center;
	margin:0 15px 15px 0;
	line-height:100%;
	float:left;
	background:#bbb;
	position:relative;
}
#post_list .date {
	color:#fff;
	display:block;
	position:absolute;
	top:10px;
	width:54px;
}
#post_list .month {
	color:#fff;
	display:block;
	position:absolute;
	bottom:10px;
	width:54px;
}
#post_list .title {
	font-size:16px;
	line-height:180%;
	margin:0 0 15px 0;
}
#post_list .title a {
	text-decoration:none;
}
#post_list .title a:hover {
	text-decoration:underline;
}
#post_list .desc {
	clear:both;
}
#post_list ul {
	margin:0;
}
#post_list li li {
	border:none;
	margin:0 25px 5px 0;
	padding:0;
	float:left;
	font-size:12px;
}
#post_list li.meta_category {
	background:url(img/common/icon_category.png) no-repeat left 3px;
	padding-left:15px;
}
#post_list li.meta_tag {
	background:url(img/common/icon_tag.png) no-repeat left 3px;
	padding-left:15px;
}
#post_list li.meta_comment {
	background:url(img/common/icon_comment.png) no-repeat left 3px;
	padding-left:15px;
}
#post_list li.meta_author {
	background:url(img/common/icon_author.png) no-repeat left 3px;
	padding-left:15px;
}
/* ----------------------------------------------------------------------
 product single page
---------------------------------------------------------------------- */
#product_headline a {
	text-decoration:none;
}
#product_headline a:hover {
	text-decoration:underline;
}
.product_title {
	margin:0 0 20px 0;
}
/* slider */
#product_image_slider_wrap {
	width:100%;
	background:#f2f2f2;
	padding:10px;
	position:relative;
	margin:0 0 20px 0;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
}
#product_image_slider_wrap #loader {
	display:none;
}
#product_image_slider {
	width:100%;
	height:auto;
margin:;
	overflow:hidden;
}
#product_image_slider img {
	width:100%;
	height:auto;
}
/* thumbnail */
.nivo-controlNav {
	padding:10px 0 0 0;
	margin:0 -4% 0 0;
}
.nivo-controlNav a {
	cursor:pointer;
	margin:0 3% 0 0;
	display:block;
	float:left;
	width:30%;
}
.nivo-controlNav a img {
	display:block;
	opacity:0.3;
	width:100%;
}
.nivo-controlNav a.active img, .nivo-controlNav a:hover img {
	opacity:1;
}
/* no slider */
#product_image {
	background:#f2f2f2;
	padding:10px;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
}
#product_image img {
	display:block;
	width:100%;
	height:auto;
}
/* bookmark */
.bookmark {
	margin:0 0 30px 0;
}
.bookmark li {
	float:left;
	margin:0 10px 0 0;
}
/* ----------------------------------------------------------------------
 side content
---------------------------------------------------------------------- */
.side_widget {
	margin:0 0 25px 0;
	font-size:12px;
}
/* search */
.widget_search #search-box, .widget_search #s {
	width:70%;
	padding:0 2%;
}
.widget_search #search-btn input, .widget_search #searchsubmit {
	width:24%;
}
/* recommend product list */
.tcdw_recommend_product_list_widget li {
	width:23%;
	margin:0 2% 2% 0;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
}
.tcdw_recommend_product_list_widget li img {
	width:100%;
	height:auto;
}
#footer .tcdw_recommend_product_list_widget li img {
	width:100%;
	height:auto;
}
#footer .tcdw_recommend_product_list_widget li {
	margin:0 2% 5% 0;
}
/* ----------------------------------------------------------------------
 header
---------------------------------------------------------------------- */
#header_wrap {
	width:100%;
}
#header {
	/* width:100%; */
	/* min-height:32px; */
	/* padding:7px 0 9px; */
	/* position:relative; */
	/* box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); */
	/* background:#fff; */
}
#description {
	display:none;
}
/* logo */
#logo_text, #logo_image {
	margin: 0px 0 0 5px;
	line-height:120%;
	float:left;
	font-size:15px;
	font-weight:normal;
	width:60%;
	overflow:hidden;
}
#logo_text a, #logo_image a {
	color:#333;
	text-decoration:none;
	display:block;
}
#logo_text a:hover, #logo_image a:hover {
}
#logo_image img {/* display:none; */
	width: 170px;
}
#logo_image a:before {/* content:attr(title); */
}
/* global menu */
#header a.menu_button {
	position:absolute;
	right:15px;
	margin:0;
	display:inline-block;
	font-size:11px;
	color:#333;
	padding:0 10px;
	line-height:30px;
	text-decoration:none;
	-moz-border-radius:4px;
	-khtml-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	border:1px solid #ccc;
}
#header a.menu_button:hover {
	background:#aaa;
	color:#fff;
}
#header a.active {
	color:#fff;
	background:#aaa;
	box-shadow:1px 1px 2px rgba(0,0,0,0.2) inset;
}
#global_menu {
	display:none;
	clear:both;
	width:100%;
	margin:0;
	top:0px;
	position:relative;
	box-shadow: 1px 2px 1.5px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 1px 2px 1.5px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 1px 2px 1.5px rgba(0, 0, 0, 0.1);
}
#global_menu ul {
	margin:0;
}
#global_menu li {
	margin:0;
	line-height:100%;
}
#global_menu li a {
	display:block;
	border:1px solid #ccc;
	margin:0 0 -1px 0;
	padding:10px 10px 10px 30px;
	line-height:160%;
	text-decoration:none;
	background:#fff url(img/common/arrow4.png) no-repeat 16px 18px;
	color:#333;
}
#global_menu li a:hover {
	background-color:#aaa;
	color:#fff;
}
#global_menu li li a {
	padding-left:45px;
	background:#fff url(img/common/arrow4.png) no-repeat 31px 18px;
}
#global_menu li li li a {
	padding-left:60px;
	background:#fff url(img/common/arrow4.png) no-repeat 46px 18px;
}
#global_menu li li li li a {
	padding-left:75px;
	background:#fff url(img/common/arrow4.png) no-repeat 61px 18px;
}
/* ----------------------------------------------------------------------
 single post page
---------------------------------------------------------------------- */
.post {
	padding:15px 0 0;
}
/* title */
#post_title {
	margin:0 0 5px 0;
}
#post_title h2 {
	margin:0;
	padding:0;
	font-size:16px;
	line-height:160%;
}
#post_title .post_date {
	font-size:12px;
	width:54px;
	height:54px;
	text-align:center;
	margin:0 15px 5px 0;
	line-height:100%;
	float:left;
	background:#bbb;
	position:relative;
}
#post_title .date {
	color:#fff;
	display:block;
	position:absolute;
	top:10px;
	width:54px;
}
#post_title .month {
	color:#fff;
	display:block;
	position:absolute;
	bottom:10px;
	width:54px;
}
/* post thumbnail */
.post_image {
	text-align:center;
	margin:0 0 30px 0;
}
.post_image img {
	margin:0;
	width:100%;
	height:auto;
}
/* next page */
#post_pagination {
	margin:0 0 30px 0;
}
#post_pagination h5 {
	margin:0 10px 0 0;
	float:left;
	line-height:30px;
	font-size:12px;
}
#post_pagination a, #post_pagination p {
	float:left;
	display:inline-block;
	background:#eee;
	margin:0 5px 0 0;
	width:30px;
	height:30px;
	line-height:30px;
	text-align:center;
	text-decoration:none;
	color:#333;
	-moz-border-radius:3px;
	-khtml-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	font-size:12px;
}
#post_pagination p {
	background:#999;
	color:#fff;
}
#post_pagination a:hover {
	background:#00a2d9;
	color:#fff;
}
/* meta and bookmark */
#post_meta {
	border-top:1px dotted #aaa;
	border-bottom:1px dotted #aaa;

	margin:0 0 40px 0;
	padding:15px 0;
}

#post_meta #meta {
	float:left;
	width:60%;
	margin:0;
	font-size:12px;
}
#post_meta #meta li {
	padding:0;
	margin:0 0 6px 0;
	line-height:160%;
}
#post_meta #meta li.meta_author {
	background:url(img/common/icon_author.png) no-repeat left 5px;
	padding:0 0 0 18px;
}
#post_meta #meta li.meta_comment {
	background:url(img/common/icon_comment.png) no-repeat left 5px;
	padding:0 0 0 18px;
}
#post_meta #meta li.meta_category {
	background:url(img/common/icon_category.png) no-repeat 3px 4px;
	padding:0 0 0 18px;
}
#post_meta #meta li.meta_tag {
	background:url(img/common/icon_tag.png) no-repeat left 5px;
	padding:0 0 0 18px;
}
#post_meta .bookmark {
	float:right;
	margin:0;
}
#post_meta .bookmark li {
	float:left;
	margin:0 0 0 10px;
}
/* related post*/
#related_post {
	margin:0 0 35px 0;
}
#related_post .headline {
	font-size:18px;
	margin:0 0 12px 0;
	line-height:100%;
}
#related_post ul {
	margin:0;
}
#related_post li {
	margin:0 0 10px 0;
	border:1px solid #ccc;
	padding:10px;
}
#related_post .image {
	float:left;
	margin:0 15px 0 0;
	background:#fff;
}
#related_post .image img {
	width:72px;
	height:72px;
	display:block;
	-webkit-transition-property:opacity;
	-webkit-transition-duration:0.4s;
	-webkit-transition-timing-function:ease;
	-moz-transition-property:opacity;
	-moz-transition-duration:0.4s;
	-moz-transition-timing-function:ease;
	-o-transition-property:opacity;
	-o-transition-duration:0.4s;
	-o-transition-timing-function:ease;
}
#related_post .image:hover img {
	opacity:0.5;
}
#related_post .info {
}
#related_post .date {
	margin:0 0 5px 0;
	line-height:100%;
	font-size:12px;
	color:#999;
}
#related_post .title {
	font-size:14px;
	margin:0;
}
#related_post .title a {
	text-decoration:none;
	display:block;
}
/* next prev post link */
#previous_next_post {
	margin:0 0 25px 0;
	padding:0;
}
#previous_next_post a {
}
#previous_post, #next_post {
	margin:0 0 5px 0;
}
#previous_post a {
	margin:0;
	line-height:140%;
	font-size:11px;
	background:url(img/common/arrow_left.gif) no-repeat left 2px;
	padding:7px 0 18px 30px;
	border-bottom:1px dotted #ccc;
	margin:0 0 10px 0;
	display:block;
}
#next_post a {
	margin:0;
	line-height:140%;
	font-size:11px;
	background:url(img/common/arrow_right.gif) no-repeat right 2px;
	padding:7px 30px 8px 0;
	display:block;
}
/* comment box-sizing: content-box;?@*/
#comment_header_right {
	float:none;
	position:relative;
	margin:0;
}
#comment_header_right li {
	float:none;
}
#comment_header_right li a, #comment_header_right li p {
	width:50%;
	margin:0 -2px -1px 0;
	float:right;
}
.comment-meta {
	margin:0 0 10px 0;
}
.comment-meta-left {
	float:left;
	width:auto;
	min-width:150px;
}
.comment-content {
	padding:0;
	margin:0;
}
#submit_comment {
	width:100%;
}
#trackback_url_area input {
	padding:5px 2%;
	width:96%;
	border:none;
	background:#eee;
}
/* ----------------------------------------------------------------------
 footer
---------------------------------------------------------------------- */
/* footer top area */
#footer {
	clear:both;
	width:100%;
	background:#f4f4f4;
}
#footer_inner {
	position:relative;
	font-size:11px;
	padding-top:20px;
}
#footer li {
	line-height:170%;
	margin:0 0 10px 0;
	padding:0;
}
/* widget area */
#footer_widget {
	margin:0 15px;
}
.footer_widget {
	margin:0 0 20px 0;
}
#footer .last_widget {
	margin:0;
}
.footer_headline {
	font-size:16px;
	margin:0 0 15px 0;
	padding:0 0 8px 0;
	border-bottom:1px dotted #aaa;
}
.footer_widget ul {
	margin:0;
}
.footer_widget li ul {
	margin:10px 0 0 0;
}
.footer_widget li {
}
.footer_widget img {
	height:auto;
	max-width:100%;
	width:auto;
}
/* copyright area */
#copyright {
	width:100%;
	background:#000;
	margin:0;
	padding:0;
	border-top:1px solid #ccc;
	color:#fff;
}
/* menu */
#footer_menu {
	margin:0;
	padding:0;
}
#footer_menu ul {
	margin:0;
	border-bottom:1px dotted #ccc;
}
#footer_menu li {
	margin:0;
	line-height:100%;
	margin:0;
	padding:0;
	border-bottom:1px dotted #ccc;
}
#footer_menu li:last-child {
	border:none;
}
#footer_menu li a {
	color:#fff;
	text-decoration:none;
	display:block;
	background:url(img/common/arrow2.gif) no-repeat 15px 18px;
	padding:15px 15px 12px 25px;
}
#footer_menu li a:hover {
	background-color:#aaa;
	color:#fff;
	text-decoration:none;
}
/* return top */
#return_top {
	position:absolute;
	bottom:4px;
	right:5px;
	display:block;
	text-indent:100%;
	overflow:hidden;
	white-space:nowrap;
	width:40px;
	height:40px;
	margin:0;
	padding:0;
	background:#bbb url(img/footer/return_top.png) no-repeat center center;
	-moz-border-radius:2px;
	-khtml-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
}
#return_top:hover {
	background-color:#00a2d9;
}
/* social link */
#social_link {
	display:none;
}
/* copyright */
#copyright p {
	margin:10px 0 10px 15px;
	float:left;
	font-size:12px;
}
#copyright a {
	text-decoration:none;
	color:#fff;
}
#copyright a:hover {
	text-decoration:underline;
}
.index_banner_h {
	font-size: 15px;
	margin: 5px 0px 0px 0px;
	text-align: center;
	font-style:bold;
	border:none;
}
.index_banner_p {
	font-size:13px;
	text-align: center;
	font-style:normal;
	border:none;
}
.gmwd_categories_container h4 {
	display:none;
}
.about {
	display:none;
}
/* 見積結果 */
#estimateResult {
	margin-bottom: 20px;
	padding: 5px;
	border: 1px solid #CCCCCC;
}
#estimateResult dl {
	overflow: hidden;
}
#estimateResult dt {
	float: left;
}
#estimateResult dd {
	float: right;
	font-size: 14px;
	font-weight: bold;
	color: #CC0000;
}
/*==================================================	
/ 見積選択
/=================================================*/
#selectEstimate {
	margin-bottom: 20px;
}
/* ラジオボタン */
#selectEstimate .radio {
	display: inline;
	margin-right: 10px;
}
#selectEstimate .radio label {
	margin-left: 2px;
}
/* チェックボックス */
#selectEstimate .checkbox {
	display: inline;
	margin-right: 10px;
}
#selectEstimate .checkbox label {
	margin-left: 2px;
}
/* 画像選択 */
#selectEstimate fieldset {
	float: left;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin-right: 10px;
}
#selectEstimate fieldset .image {
	height: 80px;
	vertical-align: middle;
	display: table-cell;
	text-align: center;
}
/* 説明 */
#selectEstimate .description {
	margin-bottom: 10px;
}
/* 要約 */
#selectEstimate .summary {
	margin-bottom: 20px;
}
/* 見積印刷
--------------------------------------------------*/
#printEstimate input.company {
	width: 400px;
}
#printEstimate input.name {
	width: 200px;
}
/*==================================================	
/ 見積内容
/=================================================*/
#estimateContent {
	margin-bottom: 20px;
}
#estimateContent table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 20px;
	border-width: 1px;
	border-style:solid;
}
#estimateContent th, #estimateContent td {
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
}
#estimateContent th {
	padding: 5px;
	font-weight: normal;
}
#estimateContent th.quantity {
	width: 60px;
}
#estimateContent th.price {
	width: 100px;
}
#estimateContent th.sumprice {
	width: 140px;
}
#estimateContent td {
	padding: 5px;
}
#estimateContent td.quantity, #estimateContent td.price, #estimateContent td.sumprice {
	text-align: right;
}
#estimateContent tfoot th, #estimateContent tfoot td {
	text-align: right;
}
#estimateContent td.discount {
	color: #ff0000;
}
/*==================================================	
/ ãŠå®¢æ§˜æƒ…å ±å…¥åŠ›
/=================================================*/

/* 複数行テキスト */
#customerForm .customerField-textarea textarea {
	padding: 5px;
}
/* ラジオボタン */
#customerForm .customerField-radio input {
	margin-right: 2px;
}
#customerForm .customerField-radio label {
	margin-right: 5px;
}
/* チェックボックス */
#customerForm .customerField-checkbox input {
	margin-right: 2px;
}
#customerForm .customerField-checkbox label {
	margin-right: 5px;
}
/* 要約 */
#customerForm .summary {
	margin-bottom: 20px;
}
/*==================================================	
/ フォーム
/=================================================*/
.formStyle {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 20px;
}
.formStyle th {
	padding: 5px;
	text-align: left;
	font-weight: normal;
	width: 96%;
	border-width: 1px;
	border-style:solid;
	display: block;
}
.formStyle td {
	padding: 5px;
	border-width: 1px;
	border-style:solid;
	display: block;
	width: 96%;
}
.formStyle input, .formStyle select, .formStyle textarea {
	font-size: 20px;
}
.formStyle input {
	vertical-align: middle;
}
.formStyle textarea {
	width: 100%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
/* å›ºå®šé …ç›®
--------------------------------------------------*/

/* 名前 */
.formStyle input.sei {
	width: 80px;
	margin-left: 2px;
	margin-right: 5px;
}
.formStyle input.mei {
	width: 80px;
	margin-left: 2px;
}
/* 郵便番号 */
.formStyle input.zip1 {
	width: 40px;
	margin-right: 2px;
}
.formStyle input.zip2 {
	width: 60px;
	margin-left: 2px;
}
/* 市区町村 */
.formStyle .addr1 {
	width: 200px;
}
/* 番地・建物名 */
.formStyle .addr2 {
	width: 98%;
}
/* 電話番号 */
.formStyle .tel1 {
	width: 50px;
	margin-right: 2px;
}
.formStyle .tel2 {
	width: 50px;
	margin-left: 2px;
	margin-right: 2px;
}
.formStyle .tel3 {
	width: 50px;
	margin-left: 2px;
}
/* メールアドレス */
.formStyle .email {
	width: 98%;
}
.formStyle .email-confirm {
	margin-top: 5px;
}
/* ボタン
--------------------------------------------------*/
.formButton {
	text-align: center;
}
.formButton .send {
	width: 140px;
}
.formButton .reset {
	width: 100px;
	margin-right: 10px;
}
/* エラー
--------------------------------------------------*/
.error-message {
	margin-top: 5px;
}
/* その他
--------------------------------------------------*/

/* å¿…é ˆé …ç›® */
.formStyle .required {
	margin-left: 2px;
	font-size: 90%;
}
/* 入力ルール */
.formStyle .rule {
	margin-left: 5px;
}
/* ラベル */
.formStyle .labelFornt {
	margin-right: 2px;
}
.formStyle .labelBack {
	margin-left: 2px;
}
/* アップロード済みの画像 */
.formStyle .setUpload {
	margin-bottom: 10px;
}
/* ページ説明 */
.explanation {
	margin-bottom: 20px;
	line-height: 150%;
}
/* 強調 */
.attention {
	color: #FF0000;
}
/* エラー色 */
#errorMess {
	color: #ff0000;
}
/* メインタイトル文字色 */
.mainTitle {
	color: #333333;
}
/* メインタイトル背景色 */
.mainTitle {
	background-color: #eeeeee;
}
/* サブタイトル文字色 */
.subTitle {
	color: #ffffff;
}
/* サブタイトル背景色 */
.subTitle {
	background-color: #0099ff;
}
/* 見出しセルの文字色 */
th {
	color: #333333;
}
/* 見出しセルの背景色 */
th {
	background-color: #eeeeee;
}
/* データセルの文字色 */
td {
	color: #333333;
}
/* データセルの背景色 */
td {
	background-color: #ffffff;
}
/* テーブル罫線の色 */
table, th, td {
	border-color: #cccccc;
	border-width: 1px;
	border-style:solid;
}
/* å¿…é ˆé …ç›®ã®æ–‡å­—è‰² */
.formStyle .required {
	color: #ff0000;
}
/* 入力説明の文字色 */
.formStyle .description {
	color: #333333;
}
/* 入力ルールの文字色 */
.formStyle .rule {
	color: #0099ff;
}
/* 入力エラー色 */
.formStyle .error-message {
	padding: 5px;
	color: #ff0000;
	border: 1px solid #ff0000;
}
.h_main {
	display:none;
}
.h_logo {
	float: left;
	width: 150px;
	padding: 10px 0px 0px 20px;
}
.h_logo img {
	width: 100%;
	height: auto;
}
main .container {
	width: 90%;
	margin: 0px auto;
}
main .ctn1 {
	background: url("https://www.web-realize.com/wp-content/uploads/2019/03/1028-tec3-whit.jpg") no-repeat center top;
	height: auto;
	background-size: cover;
}
main .ctn1 .container {
	padding-top: 50px;
}
main .ctn1 figure {
	float: right;
	margin: 0;
	text-align: right;
	width: 100px;
}
main .ctn1 figure img {
	width: 100%;
}
main .ctn1 .msg {
}
main .ctn1 .msg h1 {
	font-size: 14px;
	text-align: left;
	background: #eee;
	padding: 10px;
}
.container.clearfix .msg .mb20 {
	font-size: 12px;
	padding: 0px 0px 0px 0px;
}
main .ctn1 .msg p {
	font-size: 12px;
}
main .ctn2 {
	background: url("https://www.web-realize.com/wp-content/uploads/2019/03/whatis.jpg") no-repeat center top;
	height: auto;
	text-align: center;
	clear: both;
	padding: 20px 0px;
	margin: 0;
	background-size: cover;
	font-size:12px;
}
main .ctn2 .container {
	margin: 0px auto;
	padding: 0px;
}
main .ctn2 h3 {
	padding: 0;
	margin: 0;
}
main .ctn2 .container ul li {
	margin-top: 40px;
	float: left;
	width: 48%;
	padding: 1%;
}
main .ctn2 .container ul li figure {
	line-height: 0;
	padding: 0;
	margin: 0;
}
main .ctn2 .container ul li figure img {
	width:100%;
}
main .ctn2 .container ul li .btn {
	position: relative;
	padding: 11px 0;
	background: #111;
}
main .ctn2 .container ul li .btn:hover {
}
main .ctn2 .container ul li .btn a {
	color: #fff;
	text-decoration: none;
	font-size: 12px;
	font-weight: bold;
	position: relative;
	width: 100%;
	padding: 0px 0px 0px 0px;
}
main .ctn3 {
	background: url("https://www.web-realize.com/wp-content/uploads/2019/04/bg5sp.jpg") no-repeat center top;
	text-align: center;
	width: 100%;
	height: auto;
	background-size: cover;
	overflow: hidden;
}
main .ctn3 .box {
	width: 100%;
	height: auto;
	color: #000;
	float: left;
	padding-top: 70px;
	background: none;
}
main .ctn32 {
	background: url("https://www.web-realize.com/wp-content/uploads/2019/04/bg6sp.jpg") no-repeat center top;
	text-align: center;
	width: 100%;
	height: auto;
	background-size: cover;
	overflow: hidden;
}
main .ctn32 .box {
	width: 100%;
	height: auto;
	color: #000;
	float: left;
	padding-top: 70px;
	background: none;
}
main .ctn4 {
	padding-top: 60px;
}
main .ctn4 .ctn4_r {
	background: url("https://www.web-realize.com/wp-content/uploads/2019/04/spback.jpg");
	padding: 20px 10px 10px;
}
main .ctn4 .ctn4_r .box {
	background: #fff url("https://www.web-realize.com/wp-content/uploads/2019/04/spback.jpg") no-repeat right top;
	padding: 15px 10px 10px 10px;
	font-size: 12px;
	width: 97%;
	height: auto;
}
main .ctn4 .ctn4_l {
	background: url("https://www.web-realize.com/wp-content/uploads/2019/04/spback.jpg");
	padding: 8px;
}
main .ctn4 .ctn4_l .tt_topics {
	background-color: #fff;
	padding: 12px 20px 8px 15px;
	margin-bottom: 8px;
}
main .ctn4 .ctn4_l .tt_topics h3 {
	text-align: center;
}
main .ctn4 .ctn4_l .tt_topics p {
	float: right;
	padding-top: 12px;
}
main .ctn4 .ctn4_l .ct_topics {
	background-color: #fff;
	padding: 30px;
}
main .ctn4 .ctn4_l .ct_topics .news_in {
	overflow: auto;
}
main .ctn4 .ctn4_l .ct_topics .news_in dl {
	border-bottom: 1px dotted #d1d1d1;
	padding-bottom: 10px;
	margin-bottom: 15px;
}
main .ctn4 .ctn4_l .ct_topics .news_in dl dt {
	color: #5ebcdb;
	width: 85px;
	float: left;
	line-height: 1.5;
	font-size: 12px;
}
main .ctn4 .ctn4_l .ct_topics .news_in dl dd {
	padding-left: 85px;
	line-height: 1.5;
}
main .ctn4 .ctn4_l .ct_topics .news_in dl dd a {
	text-decoration: none;
}
main .ctn4 .ctn4_l .ct_topics .news_in dl dd a:hover {
	text-decoration: underline;
}
.dis_flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	display: -moz-flex;
	display: -ms-flex;
}
.flex_wrap {
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.flex_align_item_start {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	-ms-align-items: flex-start;
}
.flex_align_item_end {
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
	-webkit-align-items: flex-end;
	-moz-align-items: flex-end;
	-ms-align-items: flex-end;
}
.flex_align_item_center {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
}
.flex_jus_between {
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
}
.flex_jus_center {
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
}
.flex_jus_around {
	-ms-flex-pack: distribute;
	-webkit-justify-content: space-around;
	justify-content: space-around;
}
.flex_jus_start {
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	-ms-justify-content: flex-start;




}
.flex_jus_end {
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}
body footer {
	margin-top: 65px;
	background: url("https://www.web-realize.com/wp-content/uploads/2019/04/spback2.jpg");
	color: #fff;
	background-size: cover;
}
body footer .page_up {
	position: fixed;
	right: 20px;
	bottom: 60px;
}
body footer p {
	line-height: 1.8;
}
body footer .footer_in {
	padding: 60px 0 50px;
	width: 100%;
	margin: 0px auto;
}
body footer .footer_in .f_logo {
	font-size: 12px;
	color: #000;
	text-align: center;
}
body footer .footer_in .f_logo a {
	color: #bfd1de;
}
body footer .footer_in .f_logo h1 {
	margin: 20px auto;
	text-align: center;
	width: 100%;
}
body footer .footer_in .f_logo .icon_home {
	float: left;
	padding-top: 40px;
}
body footer .footer_in .f_btn {
	text-align: center;
}
body footer .footer_in .f_link {
}
body footer .footer_in .f_link ul {
	float: left;
	width: 50%;
	margin: 0;
}
body footer .footer_in .f_link ul li {
	line-height: 2.1;
	text-decoration: none;
}
body footer .footer_in .f_link ul li a {
	color: #fff;
	text-decoration: none;
	font-size: 12px;
	display: block;
	border: 1px solid #eee;
	padding: 10px;
}
body footer .footer_in .f_link ul li a:hover {
	text-decoration: underline;
}
body footer .f_co {
	background: rgba(13, 31, 46, 0.6);
	font-size: 13px;
	text-align: center;
	padding: 18px 0;
	color: #a4c1d3;
}
.menu-trigger, .menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.menu-trigger {
	position: relative;
	width: 34px;
	height: 30px;
	float: right;
	top: 12px;
	right: 24px;
}
.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 4px;
	background-color: #000;
	border-radius: 4px;
}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger span:nth-of-type(2) {
	top: 12px;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}
.menu-trigger.active span:nth-of-type(1) {
	-webkit-transform: translateY(20px) rotate(-45deg);
	transform: translateY(13px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
	opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
	-webkit-transform: translateY(-20px) rotate(45deg);
	transform: translateY(-13px) rotate(45deg);
}
.footer_fixed_nav {
	position: fixed;
	bottom: 0px;
	background: rgba(0,0,0,0.5);
	width: 100%;
	padding: 0px 0px 10px 0px;
}
.footer_fixed_nav h2 {
	color: #fff;
	font-weight: normal;
	font-size: 11px;
	text-align: center;
}
.footer_fixed_nav div.fcontact {
	float: left;
	width: 47%;
	margin: 0px 2% 0px 1%;
}
.footer_fixed_nav div.fcontact a i {margin-right: 5px;}

.footer_fixed_nav div.fcontact a {
	width: 100%;
	text-align: center;
	display: block;
	-moz-box-shadow: 0px 2px 0px 0px #ad4242;
	-webkit-box-shadow: 0px 2px 0px 0px #ad4242;
	box-shadow: 0px 2px 0px 0px #ad4242;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ff4c4c), color-stop(1, #f06363));
	background:-moz-linear-gradient(top, #ff4c4c 5%, #f06363 100%);
	background:-webkit-linear-gradient(top, #ff4c4c 5%, #f06363 100%);
	background:-o-linear-gradient(top, #ff4c4c 5%, #f06363 100%);
	background:-ms-linear-gradient(top, #ff4c4c 5%, #f06363 100%);
	background:linear-gradient(to bottom, #ff4c4c 5%, #f06363 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4c4c', endColorstr='#f06363', GradientType=0);
	background-color:#ff4c4c;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:1px solid #d15050;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size: 13px;
	padding: 7px 0px;
	text-decoration:none;
	text-shadow:0px 1px 0px #912727;
}
.footer_fixed_nav div.fcontact a:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f06363), color-stop(1, #ff4c4c));
	background:-moz-linear-gradient(top, #f06363 5%, #ff4c4c 100%);
	background:-webkit-linear-gradient(top, #f06363 5%, #ff4c4c 100%);
	background:-o-linear-gradient(top, #f06363 5%, #ff4c4c 100%);
	background:-ms-linear-gradient(top, #f06363 5%, #ff4c4c 100%);
	background:linear-gradient(to bottom, #f06363 5%, #ff4c4c 100%);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f06363', endColorstr='#ff4c4c', GradientType=0);
	background-color:#f06363;
}
.footer_fixed_nav div.fcontact a:active {
	position:relative;
	top:1px;
}
.footer_fixed_nav div.ftel {
	float: right;
	width: 47%;
	margin: 0px 2% 0px 1%;
}
.footer_fixed_nav div.ftel a {
	width: 100%;
	-moz-box-shadow: 0px 2px 0px 0px #3e7327;
	text-align: center;
	-webkit-box-shadow: 0px 2px 0px 0px #3e7327;
	box-shadow: 0px 2px 0px 0px #3e7327;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77b55a), color-stop(1, #72b352));
	background:-moz-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background:-webkit-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background:-o-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background:-ms-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background:linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77b55a', endColorstr='#72b352',GradientType=0);
	background-color:#77b55a;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:1px solid #4b8f29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size: 13px;
	padding: 7px 0;
	text-decoration:none;
	text-shadow:0px 1px 0px #5b8a3c;
}
.footer_fixed_nav div.ftel a i {margin-right: 5px;}
.footer_fixed_nav div.ftel a:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #72b352), color-stop(1, #77b55a));
	background:-moz-linear-gradient(top, #72b352 5%, #77b55a 100%);
	background:-webkit-linear-gradient(top, #72b352 5%, #77b55a 100%);
	background:-o-linear-gradient(top, #72b352 5%, #77b55a 100%);
	background:-ms-linear-gradient(top, #72b352 5%, #77b55a 100%);
	background:linear-gradient(to bottom, #72b352 5%, #77b55a 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#72b352', endColorstr='#77b55a',GradientType=0);
	background-color:#72b352;
}
.footer_fixed_nav div.ftel a:active {
	position:relative;
	top:1px;
}






/* -----------------------------------------------------------
    header
-------------------------------------------------------------- */

#area_catch {
	position: fixed;
	width: 100%;
	height: 30px;
	z-index: 1000;
	background: #0D2C3C;
}

#h1 {
	position: relative;
	width: 1200px;
	margin: 0 auto;
}

#h1 .catch{
	display: block;
	position: absolute;
	top: 10px;
	left: 155px;
	font-size: 11.25px;
	letter-spacing: 0.03em;
	color: #fff;
	z-index: 1002;
}

#area_catch.fixed {
    position: fixed;
	top: 0;
	left: 150px;
}

#header {
	position:fixed;
	top: 30px;
	width: 100%;
	height: 90px;
	z-index:1000;

}


#header.fixed {
	position: fixed;
	left: 0;
	top: 0;
	z-index:1000;
}

#header .bg_header {
	position: relative;
	top: -30px;
	width: 100%;
	height: 120px;
}

#header .bg_header.fixed {
	top: -30px;
	z-index: 1003;
}

#header .bg_header .inner {
	width: 1200px;
	position: relative;
}

#header .logo {
	float: left;
	padding: 16px 0px 0px 0px;
	text-align: center;
	width: 80%;
}

#header .logo a {
	display: block;
}

#header .logo a img{
	display: block;
	width: 160px;
}
/*          header menu          */

#header .sp_header {
	display: none;
}




/* -----------------------------
    nav
-------------------------------- */



#mdd_nav_wrap {
	position: relative;
	top: 30px;
	width: calc(100% - 319px);
	margin: 0 0 0 auto;
}

#mdd_nav_wrap ul {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
}

#mdd_nav_wrap ul li {
}

#mdd_nav_wrap ul li .no_link{
	transition: 0.5s;
    cursor: default;
}

#mdd_nav_wrap ul li a, #mdd_nav_wrap ul li .no_link{
	display: block;
	padding: 33.5px 26.5px;
	font-size: 16px;
	color: #332E2C;
}

#mdd_nav_wrap ul li a:hover, #mdd_nav_wrap ul li .no_link:hover{
	background: #E1EDF7;
	background:#687A81;
	color:#FFF;
}

#mdd_nav_wrap ul li.link_company {
	position: absolute;
	top: -22px;
	right: 430px;
	text-align:right;
	font-size: 12px;
	font-family: 'Roboto Condensed', sans-serif;
}

#mdd_nav_wrap ul li.btn_works {
	position: absolute;
	top: -30px;
	right: 240px;
}

#mdd_nav_wrap ul li.btn_30plan {
	position: absolute;
	top: -30px;
	right: 0;
}

#mdd_nav_wrap ul li.btn_works a, #mdd_nav_wrap ul li.btn_30plan a {
	padding: 0;
}

#mdd_nav_wrap ul li.btn_works a, #mdd_nav_wrap ul li.btn_30plan a:hover {
	background: none;
}

#mdd_nav_wrap ul li.link_company a:link,
#mdd_nav_wrap ul li.link_company a:visited{
	font-size: 12px;
	color:#FFF;
	text-decoration:none;
	
	display: block;
	padding: 0;
	letter-spacing: 0.13em;
}
#mdd_nav_wrap ul li.link_company a:hover{
	color:#E1EDF7;
	background:none;
}

#mdd_nav_wrap ul li .price_sub{
	color: #2DB588;
    font-weight: bold;
    transition: 0.5s;
}
#mdd_nav_wrap ul li a:hover .price_sub{
	color: #fff;
}

#mdd_overlay{
    background:#000;
    opacity:0;
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    display:none;
    z-index:100;
}
#mdd_nav_wrap {}
/*
-- Level1 -------------------------  */
ul.mdd_lv1 {
    position: relative;
    list-style:none;
    margin:0;
    padding:0;
    z-index:200;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
ul.mdd_lv1 li a {
}
ul.mdd_lv1 li a:hover,
ul.mdd_lv1 > li.selected > a {
}


/*

-- Level2 -------------------------  */
#mdd_nav_wrap ul.mdd_lv2{
    display:none;
	width:1200px;
    background: #687A81;
    padding: 30px 30px 10px 30px;
    list-style-position:outside;
	color:#332E2C;
    margin:0;















	box-sizing: border-box;
	transition: all .5s ease-in-out;
	position:absolute;
    top:90px;
    left: -155px;
}

#mdd_nav_wrap ul.mdd_lv1 li:hover ul.mdd_lv2 {
    display: flex;
}

ul.mdd_lv2 li {
	height: 80px;
	padding:0px;
	margin: 0 20px 20px 0;
	text-align:center;
}
ul.mdd_lv2.mdd_about li{
	width: calc((100% - (20px * 2)) / 3);
}
ul.mdd_lv2.mdd_about li:nth-child(3n) {
	margin: 0 0 20px 0;
}
ul.mdd_lv2.mdd_homepage li{
	width: calc((100% - (20px * 3)) / 4);
}
ul.mdd_lv2.mdd_homepage li:nth-child(4n) {
	margin: 0 0 20px 0;
}

ul.mdd_lv2 li .icon{margin: 0;line-height: normal;}
.icon {
    display: inline-block;
}
ul.mdd_lv2 li .icon img{
	width: 30px;
}

ul.mdd_lv2 li .imgicon img{
	width: 45px;
}

ul.mdd_lv2 li .icon img.icon_about01{
	width: auto;
	height: 35px;
}
ul.mdd_lv2 li .icon img.system{
	width: 20px;
}
ul.mdd_lv2 li .lead{
	font-size: 10px;
	text-align:center;
	color:#4087C7;
	padding: 0px 0 0 0;
	margin: 0;
}
ul.mdd_lv2 li .tit{
	font-size:16px;
	text-align: left;
	line-height: 1.4;
}

#mdd_nav_wrap ul li ul.mdd_lv2 li a {
	display: flex;
	width: 100%;
	height: 100%;
	background: #fff;
	align-items: center;
	padding: 10px;
	box-sizing: border-box;
}
#mdd_nav_wrap ul li ul.mdd_lv2 li a:hover {
	background:#E1EDF7;
	color:#332E2C;
}
#mdd_nav_wrap ul li ul.mdd_lv2 li a .left_block{
	width: 54px;
	margin: 0 10px 0 0;
}

ul.mdd_lv2 li .imgicon img {
    width: 45px;
}
.left_block p {
	margin:0;
	line-height: 0;
}

/*
-- Level3 -------------------------  */
ul.mdd_lv3  {
    position:static;
    padding:0;
    width: auto;
font-size:10px;
    margin-left:0px;
}
ul.mdd_lv3 li {
    float: none;
    margin-bottom:1px; 
    width: auto;   
    margin-right:0px;
    margin-left:0px;
 
}
ul.mdd_lv3 li a{
    color: #000;
    width: auto;   
    background-color: #ffffff;
}






/* -----------------------------------------------------------
    NEWS
-------------------------------------------------------------- */

.area_news {
	color: #fff;
	background: #687A81;
	position: relative;
	z-index: 20;
}

.area_news .inner{
	display:flex;
}

.area_news .bg_border{
	display:block;
	width: 90px;
	margin: 10px 0;
}

.area_news h3.title {
	padding: 17px 0;
	font-size: 18px;
	letter-spacing: 0.1em;
	color: #fff;
}

.area_news .time {
	padding: 18px 25px 18px 12px;
	font-size: 14px;
	font-family: 'Roboto Condensed', sans-serif;
}

.area_news .title_news {
	font-size: 14px;
	line-height: 1.4;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.area_news .title_news.no_link {
	padding: 18px 0;
}

.area_news .title_news a {
	display: inline-block;
	padding: 18px 13px 18px 0;
	color: #fff;
}
.area_news .title_news a:hover {
	color: #DEE0DF;
}

.area_news .more {
	font-size: 14px;
}

.area_news .more a {
	display: block;
	padding: 17px 0;
	color: #fff;
}

.area_news .more a:hover {
	color: #DEE0DF;
}

.area_news .more .fa {
	margin: 0 0 0 10px;
}



.area_news .ticker {
	margin: 0;
	width: calc(100% - 90px);
	text-align: left;
}

.area_news .ticker ul {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	margin: 10px 0 15px 0;
	/*
	flex-direction: column;
    height: 110px;
	*/
}

.area_news .ticker ul li {
	display: flex;
	width: calc((100% - 5px) / 2);
    margin: 5px 5px 0 0;
	background-color: #4D6872;
}
.area_news .ticker ul li:nth-child(2n){
	margin: 5px 0 0 0;
}
.area_news .ticker ul li a{
	/* display: flex; */
	width: 100%;
	align-items: center;
	color: #fff;
}
.area_news .ticker ul li a:hover{
	color: #DEE0DF;
}

.dis_news{
	clear:both;
	text-align:center;
	width:1100px;
	margin:50px auto;
	position: relative;
	z-index: 20;
}

.dis_news.f{
	margin:-25px auto 50px;
}

.dis_news span{
	font-family: 'Roboto Condensed', sans-serif;
	margin:0 20px 0 0;
}

.dis_news a {
	border:2px #3F86C6 solid;
	display:block;
	padding: 18px 0;
	font-weight:bold;
}

.dis_news.r a {
	border:2px #E94647 solid;
	color: #E94647;
}

.dis_news a:hover {
}

.dis_news.low {
	clear:both;
	text-align:center;
	width:1100px;
	margin:10px auto 0;
}

.col_2{
	display: flex;
    width: 1100px;
    margin: 0 auto;
}

.col_2 .dis_news:first-of-type{
	margin: 50px 15px 50px auto;
}



























/* -----------------------------------------------------------
    area-seo
-------------------------------------------------------------- */
.area-seo {
	background: #38A4ED;
	position: relative;
	z-index: 11;
}
.area-seo .inner {
	padding: 50px 0;
	background: url("control/img/seo-blue-ill.png") no-repeat right bottom;
}
.area-seo .title-block {
	margin: 0 0 20px;
	display: flex;
	align-items: center;
}
.area-seo .title-block .quality img {
	width: 190px;
	margin: 0 20px 0 -20px;
}
.area-seo .title-block .title {
	color: #fff;
	font-size: 26px;
	line-height: 1.4;
}
.area-seo .title-block .title span {
	color: #FFFF33;
}

.area-seo .area-text {
	line-height: 1.8;
	color: #fff;
	font-weight: bold;
	text-align: left;
	margin: 20px 0 30px;
}

.area-seo .btn{
}
.area-seo .btn a{
	text-align: center;
	color: #332C2C;
	font-weight: bold;
	background-color: #fff;
	display: block;
}
.area-seo .btn a:hover {
    border: 2px solid #0D2C3C;
    color: #fff;
    background: #0D2C3C;
}


@media screen and (max-width: 667px){
	
	.area-seo {
		padding: 0;
	}

	.area-seo .inner {
		background-size: 170px auto;
		background-position: right top 5px;
		padding: 30px 20px 30px;
	}
	
	.area-seo .title-block {
		margin: 0 0 15px;
		display: block;
		text-align: left;
	}
	.area-seo .title-block .quality img {
		width: 120px;
		margin: 0 0 15px -10px;
	}
	.area-seo .title-block {
		padding: 0;
	}
	.area-seo .title-block .title {
		font-size: 20px;
		text-align: center;
	}
	
	.pc_br {
		display:none;
	}
	.area-seo .area-text {
		width: auto;
		margin: 15px 0 0;
		display: none;
	}
	
	.area-seo .btn{
	text-align: center;
	width: 100%;
	}
	.area-seo .btn a{
		font-size: 15px;
		padding: 0 20px;
		width: 100%;
		height: 50px;
		border: 1px solid #332E2C;
		line-height: 50px;
		margin: 0px auto;
	}
	.area-seo .btn a:hover {
		border: 1px solid #0D2C3C;
	}
	
}



/* -----------------------------------------------------------

-------------------------------------------------------------- */
.area_renewal{
	background: #EFF7FA;
}
.area_renewal .inner{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 70px 0;
	position: relative;
	box-sizing: border-box;
}
.area_renewal .inner img{
	width: 440px;
	position: absolute;
	right: 0;
	top: 80px;
}
.title_renewal{
    font-size: 30px;
	font-weight: bold;
	line-height: 1.5;
}
.txt_renewal{
	width: calc(100% - (440px + 40px));
	margin: 20px 0 0 0;
    color: #545454;
	font-size: 17px;
    line-height: 2.0;
}
.area_renewal .yellow{
	background: linear-gradient(transparent 65%, #fdffc4 65%);
	color: #000;
}


/*     地方サイトリンク     */
.area_renewal .chiho_area {
	padding: 30px 0 0;
	display: block;
	width: 100%;
}

.area_renewal .chiho_area ul {
	display: flex;
}
.area_renewal .chiho_area ul li {
	margin: 0 30px 0 0;
	font-size: 12px;
}
.area_renewal .chiho_area ul li a {
	color: #444;
}
.area_renewal .chiho_area ul li a:hover {
	color: #3F86C6;
}
.area_renewal .chiho_area ul li a .fa {
	font-size: 1.1rem;
	padding: 0 0 0 8px;
	vertical-align: middle;
	color: #3F86C6;
}

@media screen and (max-width:667px){
	
	/*     地方サイトリンク     */
	.area_renewal .chiho_area {
		padding: 0 0 0;
	}

	.area_renewal .chiho_area ul {
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.area_renewal .chiho_area ul li {
		width: 47%;
		margin: 4% 0 0 0;
	}
	.area_renewal .chiho_area ul li a {
		display: block;
		border-bottom: 1px solid #C9D1CC;
		padding: 14px 0;
		position: relative;
	}
	
	.area_renewal .chiho_area ul li a .fa {
		position: absolute;
		right: 0;
		top: 50%;
		font-size: 1.2rem;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		color: #4087C7;
	}
		
}


/* -----------------------------------------------------------
    
-------------------------------------------------------------- */
.area_index{
	margin: 60px 0 60px 0;
}
.area_index .inner{
	display: flex;
	background: #f9f9f9;
    padding: 40px 0 40px 65px;
    box-sizing: border-box;
    border: 1px solid #e5e7ea;
}
.area_index .title.f_roboto {
	width: 185px;

	font-size: 30px;
    font-weight: bold;
    color: #332C2C;
    text-align: left;
    line-height: 1.0;
	letter-spacing: 0.05em;
}
.area_index .list_index{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	padding: 3px 0 0 0;
	margin: 0;
}
 .area_index .list_index li{
    width: 240px;
	margin: 0 0 25px 0;
}



 .area_index .list_index li:first-child{
	width: 350px;
}


.area_index .list_index li:nth-child(5){
	width: 320px;
}
.area_index .list_index li:nth-child(6){
	width: 300px;
}


.area_index .list_index li:nth-child(n+4){
	margin: 0 0 25px;
}
.area_index .list_index li.list{
	padding: 0 0 0 3px;
	margin: 0 -20px 0 20px;
	box-sizing: border-box;
	width: 150px;
}
.area_index .list_index li a{
	font-size: 16px;
    font-weight: bold;
}
.area_index .list_index li.new a::before{
	content: 'NEW';
	display: inline-block;
	color: #E94647;
	font-size: 12px;
	font-weight: bold;
	padding: 0 10px 0 0;
}




/* -----------------------------------------------------------
    トップページ　インタビューエリア

-------------------------------------------------------------- */
.area_interview {
	background: #EEF0EF;
	margin: 60px 0 80px;
	background: rgb(255, 247, 234);
}

.area_interview .inner {
	position: relative;
	display: block;
	justify-content: space-between;
	align-items: center;
	padding: 50px 20px;
}
.area_interview .interview_txt_block{
	/* display: flex; */
}

.area_interview .interview_txt_block .title {
	font-size: 31px;
	color: #332c2c;
	font-weight: normal;
	line-height: 1.0;
	margin: -10px 30px 30px 0px;
	position: relative;
	text-align: center;
}

.area_interview .interview_txt_block .title::before {
	content: "";
	display: inline-block;
	width: 50px;
	height: 109px;
	background: url(control/img/int_title_img.png) no-repeat center / contain;
	vertical-align: middle;
	margin: 0 10px 0 0;
	position: relative;
	top: -10px;
	left: 0;
	z-index: 2;
}

.area_interview .interview_txt_block .title::after {
	content: "";
	width: 290px;
	height: 1px;
	background: #3f86c6;
	background: rgb(254, 119, 83);
	position: absolute;
	bottom: 30px;
	left: 0;
	right: 0;
	margin: 0px auto;
	z-index: 0;
}

.area_interview .interview_txt_block .catch {
    color: #3f86c6;
    color: rgb(254, 119, 83);
    font-size: 22px;
    line-height: 1.5;
    font-weight: bold;
    margin: 15px 0 2px 0;
    text-align: center;
}

.area_interview .interview_txt_block .txt {
    font-size: 16px;
    color: #545454;
    line-height: 1.8;
    margin: 0 0 0 0;
}

.area_interview .interview_card_wrapper {
	display: flex;
	justify-content: space-between;
	width: 100%;
	flex-wrap: wrap;
	margin: 40px 0px 0px 0px;
}

.area_interview .interview_card {
	width: 100%;
	background: #fff;
	position:relative;
	margin: 0px 0px 70px 0px;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
	transition:transform 0.3s;
}

.area_interview .interview_card:last-of-type {
	margin-right: 0;
}

.area_interview .interview_card:hover {
	transform: translate(0, -10px);
}

.area_interview .interview_card a {
	color: #333;
	display: block;
}

.area_interview .interview_card .interview_top_thumb {
	text-align: center;
}

.area_interview .interview_card .interview_top_thumb img {
	width: 100%;
}

.area_interview .interview_card .interview_card_body {
	padding: 25px 20px;
}

.area_interview .interview_card .interview_card_body .logo {
	text-align: center;
	margin: 0 0 5px;
}

.area_interview .interview_card .interview_card_body .logo img {
	max-width: 240px;
	max-height: 35px;
}

.area_interview .interview_card .interview_card_body .card_title {
	font-size: 1.5rem;
	text-align: center;
	margin: 0 0 10px;
	line-height: 1.4;
}

.area_interview .interview_card .interview_card_body .card_catch {
	font-weight: 800;
	text-align: center;
	line-height: 1.5;
	margin: 0;
	font-size: 16px;
}

.area_interview .interview_card .interview_card_body .card_txt {
	font-size: 1.5rem;
	line-height: 1.3;
}

.area_topBtn{
	margin: 60px 0 0 0;
}
.area_topBtn .inner{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.area_topBtn a{
	display: block;
	margin: 0 0 30px;
}
.area_topBtn a:hover{
	opacity: 0.7;
}

.pc_display {
    display: none;
}
.sp_display {
    display: inline;
    width: 100%;
}




/* -----------------------------------------------------------
    オーダーメイドホームページ制作
-------------------------------------------------------------- */

.area_ordermade {
    padding: 40px 0 60px 0;
}
.area_ordermade h2.title{
	color: #3f86c6;
	font-size: 30px;
	text-align: center;
	margin: 0 0 25px 0;
}
.area_ordermade p.txt{
	margin: 0 0 35px 0;
	color: #545454;
    text-align: center;
    line-height: 1.8;
}
.area_ordermade ul{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
}
.area_ordermade ul li{
	display: block;
	width: calc((100% - 12px) / 2);
	margin: 0 0 10px 0;
}
.area_ordermade ul li:nth-child(2n){
	margin: 0 0 10px 12px;
}
.area_ordermade ul li a{
	display: inline-block;
	font-weight: bold;
	margin: 20px 0 0 auto;
	float: right;
}
.area_ordermade ul li a::after{
	display: inline-block;
	content: "\f054";
    font-family: FontAwesome;
    font-size: 1.4rem;
    color: #3F86C6;
	margin: 0 0 0 10px;
}
.area_ordermade ul li .wrapper{

	display: flex;
	width: 100%;
	align-items: flex-start;
	border: 1px solid #e5e7ea;
	box-sizing: border-box;
}
.area_ordermade ul li .wrapper img{
	width: 30px;
	margin: 0 0 7px 0;
}
.area_ordermade ul li .wrapper img.icon_system{
	width: 20px;
}
.area_ordermade ul li .wrapper .area_left{
	width: 80px;
	padding: 30px 0 0 0;
	text-align: center;
	line-height: 0;
}
.area_ordermade ul li .wrapper .area_right{
	width: calc(100% - 90px);
    padding: 35px 35px 25px 0px;
}
.area_ordermade ul li h3{
	color: #332c2c;
	font-size: 22px;
	font-weight: bold;
	margin: 0 0 20px 0;
}
.area_ordermade ul li p.english{
	font-size: 12px;
	margin: 0 0 6px 0;
}
.area_ordermade ul li a:hover p.english{
	color: #3F86C6;
}
.area_ordermade ul li p.txt{
	margin: 0;
	line-height: 1.6;
	color: #666;
	text-align: left;
}
.area_ordermade ul li .fa {
    padding: 0 0 0 5px;
}


/*東京ブランドパートナー*/
.area_ordermade ul li.andtokyo a{
	display: block;
	float: none;
	margin: auto;
}
.area_ordermade ul li.andtokyo a::after{
	display: none;
}
.area_ordermade ul li.andtokyo .wrapper{
	display: block;
	text-align: center;
	border: none;
	padding: 55px 0 45px 0px;
}
.area_ordermade ul li.andtokyo .wrapper img{
	width: 380px;
	margin: 0 0 10px 0;
}
.area_ordermade ul li.andtokyo h3{
	font-size: 16px;
}


.bn_30plan {
	margin: 0 0 50px 0;
}
.bn_30plan a{
	display: block;
}
.bn_30plan a img{
	width:100%;
}
.bn_30plan a:hover{
	opacity: 0.7;
}


/* -----------------------------------------------------------
    WORKS
-------------------------------------------------------------- */

.area_works {
	/*padding: 70px 0 100px;*/
	padding: 0 0 80px;
}

.area_works .title.f_roboto{
	font-size: 50px;
    font-weight: bold;
    color: #332C2C;
    text-align: center;
	line-height: 1.5;
	margin: 0 0 25px 0;
}
.area_works .title.f_roboto::after {
    display: block;
    content: "";
    width: 50px;
    height: 3px;
    margin: 20px auto 0;
    background: #4087C7;
}
.area_works .catch {
    padding: 30px 0 10px;
    font-size: 22px;
    font-weight: bold;
    color: #3F85C5;
    text-align: center;
}

.area_works .txt {
	margin: 25px 0;
	color: #545454;
	text-align: center;
	line-height: 1.8;
}

.area_works .list_works {
	margin: 0 0 0;
}

.area_works .list_works li {
	float: left;
	margin: 25px 0 0 24px;
}

.area_works .list_works li img{
	width:350px;
}

.area_works .list_works li:first-child, .area_works .list_works li:nth-child(3n+1) {
	margin: 25px 0 0 0;
}

.area_works .list_works li a {
	color: #fff;
}

.area_works figure {
	position: relative;
	overflow: hidden;
	width: 350px;
	margin: 0;
}

.area_works figcaption {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.6);
	-webkit-transition: .3s;
	transition: .3s;
	opacity: 0;
}

.area_works figure:hover figcaption {
	opacity: 1;
}

.area_works .transform {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

.area_works figure:hover .transform {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}

.area_works figure h3 {
	padding: 80px 10px 10px 10px;
	color: #fff;
	font-size: 14px;
	text-align: center;
	line-height: 1.5;
}

.area_works figure p {
	color: #fff;
	text-align: center;
	font-size: 13px;
	line-height: 1.5;
}


.area_works .btn {
	display: flex;
	width: 100%;
	justify-content: center;
	margin: 50px 0 0;
	text-align: center;
}

.area_works .btn a {
	width: 350px;
	padding: 30px 0;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	/*border: 2px solid #332E2C;*/
	border: none;
	margin: 0 15px;
}
.area_works .btn a.works{
	background: #329898;
}
.area_works .btn a.beforeafter{
	background: #F48C00;
}
.area_works .btn a:hover{
	opacity: 0.8;
	border: none;
}


/* -----------------------------------------------------------
    BLOG
-------------------------------------------------------------- */

.area_blog {
	margin: 0 0 -50px;
	/*padding: 80px 0 120px;*//*コンテンツが来たら戻す*/
	padding: 0 0 120px;
	/*background: #EEF0EF;*/
}

.area_blog p.title.f_roboto{
	font-size: 50px;
	font-weight: bold;
    color: #332C2C;
    text-align: center;
	line-height: 1.5;
	margin: 0 0 25px 0;
}
.area_blog p.title.f_roboto::after {
    display: block;
    content: "";
    width: 50px;
    height: 3px;
    margin: 20px auto 0;
    background: #4087C7;
}

.area_blog .catch {
    padding: 30px 0 10px;
    font-size: 22px;
	font-weight: bold;
    color: #3F85C5;
    text-align: center;
}

.area_blog .txt {
	margin: 25px 0;
	color: #545454;
	text-align: center;
	line-height: 1.8;
}

.list_blog {
	margin: 40px 0 0;
}

.list_blog li {
	float: left;
	margin: 0 0 0 32px;
	width: 251px;
}

.list_blog li:first-child, .list_blog li:nth-child(4n+1) {
	margin: 0;
}

.list_blog li a {
	display: block;
	padding: 20px 18px;
	border: 1px solid #E4E6E9;
	min-height:160px;
	/*background: #fff;*/
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.list_blog li a:hover {
	border: 1px solid #0D2C3C;
	color: #000;
}

.list_blog .blog_date {
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #666;
	letter-spacing: 0.05em;
}

.list_blog .blog_title {
	width: 100%;
	margin: 15px 0 0;
	letter-spacing: 0.05em;
	color:#666;
	line-height: 1.8;
}

.area_blog .btn {
	display: block;
	margin: 50px 0 0;
	text-align: center;
}

.area_blog .btn a {
	width: 350px;
	padding: 20px 25px;
	font-size: 16px;
	background: #fff;
}

.area_blog .btn a:hover {
	color: #000;
}



/* -----------------------------------------------------------
    OUR SERVICES
-------------------------------------------------------------- */

.area_services {
	margin: 20px 0 0;
	padding: 70px 0 70px 0;
	background: #EEF0EF;
}

.area_services .title.f_roboto{
	font-size: 50px;
	font-weight: bold;
    color: #332C2C;
    text-align: center;
	line-height: 1.5;
	margin: 0 0 25px 0;
}
.area_services .title.f_roboto::after{
	display: block;
    content: "";
    width: 50px;
    height: 3px;
    margin: 20px auto 0;
    background: #4087C7;
}

.area_services .catch{
	padding: 30px 0 10px;
    font-size: 22px;
	font-weight: bold;
    color: #3F85C5;
    text-align: center;
}

.area_services .txt_top {
	margin: 25px 0;
	color: #545454;
	text-align: center;
	line-height: 1.8;
}



/*          ホームページ制作 + システム～サーバー       */
.area_services_homepage .nav, .area_services_system .nav {
	/* display: flex; */
	width: 100%;
	/* flex-wrap: wrap; */
}
.area_services_homepage .nav li, .area_services_system .nav li{
	display: block;
	width: 100%;
	margin: 0 30px 30px 0;
	text-align: center;
}
.area_services_homepage .nav li:nth-child(2n), .area_services_system .nav li:nth-child(2n){
    margin: 0 0 30px 0;
}
.area_services_homepage .nav li:first-child{
}
.area_services_homepage .nav li a, .area_services_system .nav li a{
	display: inline-block;
    font-weight: bold;
    margin: 20px 0 0 auto;
    float: right;
}
.area_services_homepage .nav li a::after, .area_services_system .nav li a::after{
	display: inline-block;
    content: "\f054";
    font-family: FontAwesome;
    font-size: 1.4rem;
    color: #3F86C6;
    margin: 0 0 0 10px;
}
.area_services_homepage .nav li .area_top, .area_services_system .nav li .area_top{
	width: 100%;
	padding-top: 46%;
}
.area_services_homepage .nav li .area_bottom, .area_services_system .nav li .area_bottom{
	padding: 25px 15px;
	background: #fff;
}
.area_services_homepage .nav li img, .area_services_system .nav li img{
    width: 30px;
    margin: 0 0 7px 0;
}
.area_services_homepage .nav li h3, .area_services_system .nav li h3{
    color: #332c2c;
    font-size: 20px;
    font-weight: bold;
    margin: 0 0 15px 0;
}
.area_services_homepage .nav li p.english, .area_services_system .nav li p.english{
    font-size: 14px;
    color: #fff;
}
.area_services_homepage .nav li p.txt, .area_services_system .nav li p.txt{
    line-height: 1.6;
    text-align: left;
    color: #666;
	margin: 0;
}
.area_services_system .nav li img.icon_system {
    width: 20px;
}


/*          ホームページ制作          */

.area_services .area_services_homepage {
	margin: 40px 0 0;
}

.area_services .area_services_system {
	padding: 0;
	background:none;
}
.area_services .box {
    width: 100%;
    height: auto;
    background: none;
    color: inherit;
}

/* -----------------------------
    アイコン表示
------------------------------ */
/*          共通       */
.area_services_homepage .nav li .icon, .area_services_system .nav li .icon{
    margin: 40px auto 10px auto;
	background-size: contain;
}

/*          ホームページ制作        */
/*30プラン*/
.icon.icon_30plan01{
	background: url(control/img/icon_30plan02.png) no-repeat;
	width: 40px;
    height: 26px;
}
.area_services_homepage .nav li.plan30 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/01/img_homepage01.jpg) center center /cover no-repeat;;
}
.icon.icon_original01{
	background: url(control/img/icon_original02.png) no-repeat;
	width: 32px;
    height: 31px;
}
.area_services_homepage .nav li.original .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/01/img_homepage02-1.jpg) center center /cover no-repeat;;
}
.icon.icon_sitemap01{
	background: url(control/img/icon_sitemap01.png) no-repeat;
	width: 30px;
    height: 32px;
}
.icon.icon_corporate01{
	background: url(control/img/icon_corporate01.png) no-repeat;
	width: 30px;
    height: 34px;
}
.icon.icon_recruit01{
	background: url(control/img/icon_recruit01.png) no-repeat;
	width: 30px;
    height: 28px;
}
.icon.icon_ec01{
	background: url(control/img/icon_ec01.png) no-repeat;
	width: 30px;
    height: 30px;
}
.icon.icon_listing01{
	background: url(control/img/icon_listing01.png) no-repeat;
	width: 30px;
    height: 28px;
}
.icon.icon_portal01{
	background: url(control/img/icon_portal01.png) no-repeat;
	width: 30px;
    height: 31px;
}
.icon.icon_official01{
	background: url(control/img/icon_official01.png) no-repeat;
	width: 30px;
    height: 27px;
}



/* -----------------------------------------------------------
    RECRUIT
-------------------------------------------------------------- */
.area_recruit{
	padding: 30px 0 10px 0;
	margin: 120px 0 180px 0;
	position: relative;
}
.area_recruit::before{
	content: '';
	display: block;
    background: #eef0ef;
    width: calc(835 / 1500 * 100%);
    height: 100%;
    position: absolute;
    top: 65px;
    left: 0;
    z-index: -1;
}
.area_recruit .img_recruit{
	position: absolute;
	top: 0;
	right: 0;
	width: calc(850 / 1500 * 100%);
}
.area_recruit .img_recruit img{
	width: 100%;
}
.area_recruit .title{
	font-size: 75px;
    color: #332c2c;
    font-weight: normal;
    line-height: 1.0;
    margin: 0 0 40px 0;
}
.area_recruit h2.catch{
	color: #3f86c6;
    font-size: 30px;
	line-height: 1.5;
	font-weight: bold;
	margin: 0 0 20px 0;
}
.area_recruit p.txt{
	font-size: 16px;
	color: #545454;
	line-height: 1.8;
	margin: 0 0 60px 0;
}
.area_recruit .btn_entry a, .area_recruit .btn_green a, .area_recruit .btn_mynavi a{
	display: block;
	width: 350px;
	height: 60px;
	position: relative;
	overflow: visible;
	box-sizing: border-box;

}
.area_recruit .btn_entry a{
	padding: 20px 25px;
	font-size: 16px;
	text-align: center;
	color: #332C2C;
    font-weight: bold;
    border: 2px solid #332E2C;
	background-color: #fff;
	margin: 0 0 50px 0;
}
.area_recruit .btn_entry a:hover {
    border: 2px solid #0D2C3C;
    color: #fff;
    background: #0D2C3C;
}
.area_recruit .btn_entry a img{
	display: block;
	height: 100px;
	position: absolute;
	right: 23px;
	bottom: 0;
}
.area_recruit .btn_entry .fa {
    padding: 0 0 0 12px;
}
.area_recruit .btn_mynavi a{
	background: #fff;
	border: 2px solid #00abeb;
	margin: 0 0 40px 0;
}
.area_recruit .btn_mynavi a:hover{
	opacity: 0.7;
}
.area_recruit .btn_mynavi a img.mynavi01{
	display: block;
    height: 28px;
    position: absolute;
    top: 14px;
    left: 0;
    right: 0;
    margin: auto;
}
.area_recruit .btn_mynavi a img.mynavi02{
	display: block;
	height: 100px;
	position: absolute;
	right: 23px;
	bottom: 0;
}
.area_recruit .btn_green a{
	background-color: #33b913;
}
.area_recruit .btn_green a:hover{
	opacity: 0.7;
}
.area_recruit .btn_green a img.green01{
	display: block;
	position: absolute;
	left: 20px;
	bottom: 12px;
}
.area_recruit .btn_green a img.green02{
	display: block;
	height: 100px;
	position: absolute;
	right: 21px;
	bottom: 0;
}


/* -----------------------------------------------------------
    無料相談
-------------------------------------------------------------- */
.area_ask{
	margin: 0;
}



/* -----------------------------------------------------------
    無料相談
-------------------------------------------------------------- */

.area_ask {
	margin: 50px 0 0;
	background: url("control/img/freeask_bg.png") repeat;
}

.area_ask .box_txt {
	text-align: center;
	background: #fff;
	padding: 50px 20px;
	border: 2px solid #0c2c3a;
	border-right: none;
	border-left: none;
	position: relative;
}

.area_ask .box_txt::before, .area_ask .box_txt::after{
	display: none;
	content: '';
	position: absolute;
}
.area_ask .box_txt::before{
    width: 87px;
    height: 125px;
    background: url(control/img/img_freeask01.png) no-repeat center / contain;
    top: 190px;
    left: 0;
}

.area_ask .box_txt::after{
    width: 95px;
    height: 144px;
    background: url(control/img/img_freeask02.png) no-repeat center / contain;
    top: 175px;
    right: 0;
}
.area_ask h3.title {
	display: inline-block;
	color: #333;
	font-size: 32px;
	font-weight: bold;
	background: linear-gradient(#fff 60%,#fcff49 60%);
	padding: 0;
}

.area_ask .lead {
	font-size: 20px;
}

.area_ask .txt {
	padding: 25px 0 0 0;
	font-size: 16px;
	line-height: 1.75;
	margin: 0;
}

.area_ask .txt_sub{
	font-weight: bold;
	margin: 30px 0 0;
}
.area_ask .txt_sub::before, .area_ask .txt_sub::after{
	content: '';
    display: inline-block;
    width: 15px;
    height: 2px;
    background-color: #333;
    margin-bottom: 2px;
}
.area_ask .txt_sub::before{
	margin-right: 20px;
    transform: rotate(60deg);
}
.area_ask .txt_sub::after{
	margin-left: 20px;
    transform: rotate(-60deg);
}

.area_ask .btn {
	margin: 55px 0 0;
}

/* ボタン元
.area_ask .btn a{
	width: 500px;
	color: #fff;
	font-size: 24px;
    font-weight: bold;
	padding: 30px 0;
	background: #E94647;
    border: 1px solid #E94647;
    border-radius: 100px;
	box-shadow: 0 8px 0 #a03536;
	overflow: hidden;
	-webkit-transition: all .2s;
    transition: all .2s;
	position: relative;
}
*/

.area_ask .btn a{
	width: 100%;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	padding: 10px 60px;
	background: #E94647;
	border: 1px solid #E94647;
	border-radius: 8px;
	box-shadow: 0 5px 0 #a03536;
	overflow: hidden;
	-webkit-transition: all .2s;
	transition: all .2s;
	position: relative;
}
.area_ask .btn a span.fa {
    display: inline-block;
    content: "";
    position: absolute;
    transition: 0.3s;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	font-size: 20px;
}

.area_ask .btn a::before{
	content: "";
    background-image: linear-gradient(130deg,hsla(0,0%,100%,0) 20%,hsla(0,0%,100%,.5) 0,hsla(0,0%,100%,0) 80%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition: all 0.1s;
    transition: all 0.1s;
    -webkit-animation: shiny 5s infinite linear;
    animation: shiny 5s infinite linear;
}


@-webkit-keyframes shiny {
  0% {
    left: -50%
  }
  20% {
    left: 120%
  }
  to {
    left: 120%
  }
}
@keyframes shiny {
  0% {
    left: -50%
  }
  20% {
    left: 120%
  }
  to {
    left: 120%
  }
}


.area_ask .btn a:hover{
	border: 1px solid #E94647;
	/*
	-webkit-transform: translateY(4px);
    transform: translateY(4px);
	*/
	-webkit-transform: translateY(2px);
    transform: translateY(2px);
	background: #E94647;
    box-shadow: 0 2px 0 #a03536;
}


/* -----------------------------
    button
-------------------------------- */

.btn {
	display: inline-block;
}

.btn a {
	display: inline-block;
	position: relative;
	z-index: 2;
	overflow: hidden;

	/*width: 250px;*/
	padding: 15px 25px;
	border: 1px solid #C9D1CC;
	font-size: 14px;
	text-align: center;
	color: #332C2C;

		
	-webkit-box-sizing: border-box;	
	-moz-box-sizing: border-box;	
	box-sizing: border-box;
}

.btn a::before,
.btn a::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}

.btn a,
.btn a::before,
.btn a::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .7s;
	transition: all .7s;
}

.btn a:hover {
	border: 1px solid #0D2C3C;
	color: #fff;
	background: #0D2C3C;
}


.btn .fa {
	padding: 0 0 0 12px;
}


.btn.blue a:hover {
	border: 1px solid #4087C7;
	color: #fff;
	background: #4087C7;
}



/* -----------------------------------------------------------
    footer
-------------------------------------------------------------- */

#footer {
	/*position: relative;
	top:120px;*/
	color: #332C2C;
	padding: 0px 0px 70px 0px;
}

.area_about a, .area_sitemap a {
	color: #332C2C;
}

.area_about a, .area_sitemap a:hover {
	color: #999;
}


/*     会社概要・お問い合わせ     */

#footer .area_about {
	padding: 50px 0;
	/*
	border-bottom: 1px solid #C9D1CC;
	*/
	/* display: flex; */
	/* align-items: center; */
}

#footer .area_about .logo {
	/*
	float: left;
	*/
	margin: 0;
	text-align: center;
}

#footer .area_about .logo img {
	width: 140px;
}

#footer .box_company {
	width: 100%;
}

#footer .box_contact {
	/* float: right; */
	/* width: 430px; */
	margin-left:20px;
}

#footer .box_company .title, #footer .box_contact .title {
	margin: 5px 0 0;
	font-weight: bold;
	text-align: center;
}

#footer .box_company .txt_address, #footer .box_contact .txt {
	padding: 10px 0 0;
	font-size: 14px;
	line-height: 1.7;
	text-align: center;
}

#footer .area_about .btn {
	margin: 22px 10px 0 0;
}

#footer .area_about .btn.consul a {
	background: #E94647;
	border: 1px solid #E94647;
	color: #fff;
}

#footer .area_about .btn.consul a:hover {
	opacity: 0.7;
}

#footer .area_about .btn.mr_0 {
	margin: 22px 0 0 0;
}


/*     地方サイトリンク     */
#footer .chiho_area {
	clear: both;
	/*
	border-top: 1px solid #C9D1CC;
	*/
	padding: 10px 0 0;
}

#footer .chiho_area ul {
	display: flex;
}
#footer .chiho_area ul li {
	margin: 15px 30px 0 0;
	font-size: 12px;
}
#footer .chiho_area ul li a {
	color: #332C2C;
}
#footer .chiho_area ul li a:hover {
	color: #999;
}
#footer .chiho_area ul li a .fa {
	font-size: 1.1rem;
	padding: 0 0 0 8px;
	vertical-align: middle;
}

/*
#footer .chiho_area .btn {
	margin: 15px 10px 0 0;
	text-align: center;
}
#footer .chiho_area .btn a {
	display: flex!important;
	align-items: center!important;
	justify-content: center;
	padding: 0;
	border: none;
	text-align: center;
	position: relative;
}
#footer .chiho_area .btn.mr_0 {
	margin: 15px 0 0 0;
}

#footer .chiho_area .btn a .fa {

	position: absolute;
	right: 20px;
	top: 50%;
	font-size: 1.2rem;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
*/

@media screen and (max-width:667px){
	
	/*     地方サイトリンク     */
	#footer .chiho_area {
		padding: 5px 15px 0;
	}

	#footer .chiho_area ul {
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#footer .chiho_area ul li {
		width: 47%;
		margin: 4% 0 0 0;
		font-size: 12px;
	}
	#footer .chiho_area ul li a {
		display: block;
		border-bottom: 1px solid #C9D1CC;
		padding: 9px 0;
		position: relative;
	}
	
	/*
	#footer .chiho_area ul li a {
		display: block;
		border: 1px solid #C9D1CC;
		padding: 15px 15px;
		position: relative;
	}
	#footer .chiho_area ul li a:hover {
		background: #0D2C3C;
		border: 1px solid #0D2C3C;
		color: #fff;
	}
	*/
	#footer .chiho_area ul li a .fa {
		position: absolute;
		right: 0;
		top: 50%;
		font-size: 1.2rem;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		color: #4087C7;
	}
		
}



/*     サイトマップ     */

#footer .area_sitemap {
	padding: 50px 0;
	background: #EEF0EF;
}

#footer .area_sitemap > .inner{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

#footer .area_sitemap .link_home {
	/*float: left;
	margin: 0 50px 0 0;*/
	font-size: 15px;
}

/*#footer .area_sitemap .list_map {
	float: left;
	margin: 0 50px 0 0;
}*/

#footer .area_sitemap .list_map.map02{
	width: 480px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

#footer .area_sitemap .list_map .title {
	width: 100%;
	padding: 0 0 25px;
	font-size: 15px;
}

#footer .area_sitemap .list_map.map03 .title, #footer .area_sitemap .list_map.map04 .title{
	padding: 0 0 25px;
}

#footer .area_sitemap .list_map .title.under {
	padding: 25px 0 15px;
}

#footer .area_sitemap .list_map ul {
    padding: 0 0 10px;
}

#footer .area_sitemap .list_map ul li {
	margin: 0 0 15px 0;
	font-size: 12px;
	letter-spacing: 0.07em;
}
#footer .area_sitemap .list_map ul li a:hover {
	color: #999;
}
#footer .area_sitemap .list_map ul li a::before{
	content: '- ';
}


/*     著作権    */
#footer .legal_area{
	padding:35px 0 0 0;
}
#footer .legal_area .legal_txt{
	/* width:1100px; */
	margin:0 auto;
	font-size: 11px;
	color:#777;
	line-height:1.6;
	text-align: center;
}



/*     コピーライト     */

#footer .area_copy {
	padding:25px 0 35px 0;
}

#footer .area_copy small {
	/* float: left; */
	font-size: 13px;
	color: #999;
	text-align: center;
	display: block;
}

#footer .area_copy ul {
	float: right;

}

#footer .area_copy ul li {
	float: left;
	margin: 0 0 0 10px;
	font-size: 11px;
}

#footer .area_copy ul li a {
	color: #332C2C;
}

#footer .area_copy ul li a:hover {
	color: #999;
}


/*          システム～サーバー         */
.icon.icon_system01{
	background: url(control/img/icon_system02.png) no-repeat;
	width: 20px;
    height: 34px;
}
.area_services_system .nav li.system .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/01/img_homepage03.jpg) center center /cover no-repeat;
}
.area_services_system .nav li.marketing02 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/07/img_homepage07-1.jpg) center center /cover no-repeat;
}
.icon.icon_marketing01{
	background: url(control/img/icon_marketing02.png) no-repeat;
	width: 30px;
    height: 29px;
}
.area_services_system .nav li.marketing .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/01/img_homepage04.jpg) center center /cover no-repeat;;
}
.icon.icon_tel01{
	background: url(control/img/icon_tel02.png) no-repeat;
	width: 30px;
    height: 29px;
}
.area_services_system .nav li.support .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/01/img_homepage05.jpg) center center /cover no-repeat;;
}
.icon.icon_server01{
	background: url(control/img/icon_server02.png) no-repeat;
	width: 32px;
    height: 23px;
}
.area_services_system .nav li.server .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/01/img_homepage06.jpg) center center /cover no-repeat;;
}
.area_services_system .nav li.server02 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/03/img_homepage07.jpg) center center /cover no-repeat;;
}
.area_services_system .nav li.server03 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2022/03/img_homepage08.jpg) center center /cover no-repeat;;
}



.area_services_system .nav li.server04 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2023/07/img_homepage09.jpg) center center /cover no-repeat;;
}

.area_services_system .nav li.server05 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2023/07/img_homepage10.jpg) center center /cover no-repeat;;
}
.area_services_system .nav li.server06 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2025/01/img_homepage08.jpg) center center /cover no-repeat;;
}
.area_services_system .nav li.server07 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2025/01/img_homepage09.jpg) center center /cover no-repeat;;
}
.area_services_system .nav li.server08 .area_top{
	background: url(https://www.web-realize.com/wp-content/uploads/2025/01/img_homepage10.jpg) center center /cover no-repeat;;
}

/* -----------------------------------------------------------
    ホームページ制作 
-------------------------------------------------------------- */
	
	.area_services_homepage .box {
		margin: 30px 0 0;
	}
	
	.area_services_homepage  .box.homepage .img_title {
		width: 100%;
		height: auto;
		/*min-height: 100px;*/
		background: url(control/img/sp_img_top_services01.jpg) no-repeat center top / 320px 100px;
		background-size: cover;
	}
	
	.area_services_homepage .box.homepage .title {
		padding: 38px 0 0;
		text-align: left;
	}

	.area_services_homepage .homepage02 {
		margin: 0px 0 5px;
		width: 27px;
		height: 32px;
		background-size: 27px 32px;
	}

/* -----------------------------
    システム～サーバー
------------------------------ */

/*          システム開発 マーケティング         */


.area_services_system {
	margin:0;
	padding: 100px 0 80px;
	background: #EEF0EF;
}


.area_services_system .box.system {
	float: left;
	width: 530px;
}

.area_services_system .box.system .img_title {
	height: 210px;
	background: url(control/img/img_top_services02.jpg) no-repeat left top;
}

.area_services_system .box.system .img_title.homepage {
	height: 210px;
	background: url(control/img/img_top_services04.jpg) no-repeat left top;
}

.area_services_system .box.marketing {
	float: right;
	width: 530px;	
}

.area_services_system .box.marketing .img_title {
	height: 210px;
	background: url(control/img/img_top_services03.jpg) no-repeat left top;
}

.area_services_system .box.system .title, .area_services_system .box.marketing .title {
	padding: 20px 0 0;
}

.area_services_system .box.system .catch, .area_services_system .box.marketing .catch {
	padding: 40px 0 0;
	font-weight: bold;
	font-size: 20px;
	color: #3F85C5;
}

.area_services_system .box .txt, .area_services_system .box .txt {
	padding: 15px 0 40px;
	font-size: 14px;
	color: #666;
	line-height: 1.6;
	letter-spacing: 0.1em;
}

.area_services_system .box .point {
	/*padding: 50px 0 0;*/
	font-size: 20px;
	font-weight: bold;
}

.area_services_system .box .system02 {
	margin: 45px 0 5px 5px;
	width: 30px;
	height: 52px;
	background-size: 30px 52px;
}

.area_services_system .box .marketing02 {
	margin: 54px 0 5px 5px;
	width: 48px;
	height: 46px;
	background-size: 48px 46px;
}

/*          アフターサポート サーバープラン          */
	.area_services_system .box {
		background: #fff;
	}
	
	.area_services_system .box.support {
		float: left;
		width: 530px;
	}

	.area_services_system .box.surver {
		float: right;
		width: 530px;
	}

	.area_services_system .box.support .point, .area_services_system .box.surver .point {
		float: left;
		padding: 0px 30px 0 0;
		color: #3F85C5;
		font-size: 14px;
		font-weight: normal;
	}

	.area_services_system .box.support .tel01 {
		margin: 7px 0 5px;
		width: 31px;
		height: 30px;
		background-size: 31px 30px;
	}

	.area_services_system .box.surver .server01 {
		margin: 10px 0 5px;
		width: 37px;
		height: 25px;
		background-size: 37px 25px;
	}

	.area_services_system .box.support .title, .area_services_system .box.surver .title {
		font-weight: bold;
		text-align: left;
		color: #332C2C;
	}

	.area_services_system .box.support a, .area_services_system .box.surver a {
		padding: 30px;
	}

	.area_services_system .box.support .txt, .area_services_system .box.surver .txt {
		padding: 8px 0 0 !important;
		text-align: left;
	}


    
    
    
    

/* -----------------------------------------------------------
    SP
-------------------------------------------------------------- */
@media screen and (max-width:667px){



	/* -----------------------------------------------------------
		MAIN VISUAL
	-------------------------------------------------------------- */

	.main_visual {
		height: auto;
		min-height: 240px;
		padding:0;
	}
	.main_visual .inner.wrap20{
		top: 83px;
    	left: auto;
	}
	.main_visual .catch {
		width: 100%;
		font-size: 120%;
		color: #fff;
		text-align: center;
		font-weight: bold;
		left: 0;
		top: 0;
		padding: 65px 0 0;
	}
	.main_visual .sub_catch {
		font-size: 60%;
		color: #FFF;
		text-align: center;
		margin:10px 0 0 0;
		font-weight:bold;
	}
	.main_visual .title {
		width: 100%;
		padding: 10px 0 0;
		font-size: 140%;
		font-weight: bold;
		color: #fff;
		line-height: 1.5;
		letter-spacing: 0.03em;
		text-align: center;
		/*
		top: 103px;
		left: 0;
		*/
	}

	.main_visual .title span {
		letter-spacing: 0.02em;
	}

	.main_visual .btn {
		margin: 30px 0 0;
		width: 100%;
	}

	.main_visual .btn a {
		width: auto;
		padding: 12px 18px;
		border: 2px solid #fff;
		font-size: 90%;
		color: #fff;
		letter-spacing: 0.02em;
	}

	.main_visual .btn a:hover {
		color: #fff;
		background: #0D2C3C;
	}

	.main_visual .btn a span {
		font-size: 110%;
	}

	/* -----------------------------------------------------------
    	NEWS
	-------------------------------------------------------------- */

	.area_news {
		color: #687A81;
		background: #fff;
	}

	.area_news .inner{
		display:block;
		margin: 0 0 20px 0;
		padding: 20px;
	}

	.area_news .bg_border{
		width:100%;
		margin: 0;
	}

	.area_news h3.title {
		float: left;
		padding: 15px 20px 0 0;
		font-size: 115%;
		font-weight: normal;
		color: #332C2C;
		margin: 0;
	}

	.area_news .time {
		float: none;
		clear: both;
		padding: 5px 0 3px 0;
		font-size: 85%;
		display: block;
		margin: 0;
	}

	.area_news .title_news {
		float: none;
		font-size: 95%;
		width: 100%;
		line-height: 1.5;
		overflow: inherit;
		text-overflow: inherit;
		white-space: inherit;
	}

	.area_news .title_news.no_link {
		padding: 5px 0 10px;
		margin: 0 0 10px;
	}

	.area_news a .title_news {
		display: block;
		padding: 5px 0 10px;
		margin: 0px;
		color: #3F86C6;
	}

	.area_news .title_news a:hover {
		color: #3F86C6;
	}

	.area_news a:hover .title_news {
		color: #3F86C6;
	}

	.area_news .more {
		padding: 0;
		float: right;
		font-size: 90%;
		line-height: 0;
		margin: 0px 0px 0px 0px;
	}

	.area_news .more a {
		padding: 18px 20px 15px 15px;
		color: #fff;
		background: #687A81;
	}

	.area_news .more a:hover {
		color: #687A81;
	}

	.area_news .more .fa {
		margin: 0 0 0 10px;
	}


	.area_news .ticker {
		float: none;
		margin: 0;
		padding: 0;
		width: 100%;
	}

	.area_news .ticker ul {
		display: block;
		margin: 0;
		height: auto;
	}

	.area_news .ticker ul li {
		display: block;
		width: 100%;
		margin: 0;
		background: transparent;
	}

	.area_news .ticker ul li a{
		padding: 5px 0;
		color: #3F86C6;
	}

	.dis_news{
		clear:both;
		width:auto;
		margin: 0 20px 30px 20px;
		font-size:14px;
		line-height: 1.5;
	}

	.dis_news.f{
		margin: -15px 20px 20px 20px;
	}


	.dis_news span{
		margin:0 10px 0 0;
	}

	.dis_news a {
		border:2px #3F86C6 solid;
		padding: 14px 10px;
	}

	.dis_news.low{
		clear:both;
		width:auto;
		margin:-20px 20px 30px 20px;
		font-size:14px;
		line-height: 1.5;
	}

	.col_2{
		display: block;
		width: 100%;
	}

	.col_2 .dis_news:first-of-type{
		margin: 0 20px 15px 20px;
	}

	/* -----------------------------------------------------------
    	東京池袋のホームページ制作・WEBサイトリニューアルの専門会社です。
	-------------------------------------------------------------- */
	.area_renewal{
		border-top: 1px solid #E1E1E1;
	}
	.area_renewal .inner{
		display: block;
		padding: 25px 15px;
	}
	.title_renewal{
		font-size: 18px;
		text-align: center;
	}
	.area_renewal .inner img{
		display: none;
		width: auto;
		margin: 25px auto 10px auto;
		position: static;
		}
	.txt_renewal{
		width: 100%;
		font-size: 15px;
		text-align: center;
		line-height: 1.8;
		margin: 15px 0 0 0;
	}
	.txt_renewal p{
		text-align: left;
	}
	.accordion_more{
		/* display: none; */
	}
	.area_renewal .accordion_btn{
		display: inline-block;
		text-align: center;
		color: #333;
		line-height: 1.0;
		background: #fff;
		padding: 10px 60px;
		margin: 20px auto 0 auto;
		border: 1px solid #C9D1CC;
		border-radius: 50px;
		cursor: pointer;
		overflow: hidden;
		position: relative;
		z-index: 2;
	}
	.area_renewal .accordion_icon{
		display: block;
		position: absolute;
		top: 8px;
		right: 20px;
		width: 20px;
		height: 20px;
		margin: 0 0 0 auto;
	}
	.area_renewal .accordion_icon span {
		width: 50%;
		position: absolute;
		left: 5px;
		height: 1px;
		background-color: #333;
		border-radius: 4px;
		transition: all .4s;
		box-sizing: border-box;
	}
	.area_renewal .accordion_icon span:nth-of-type(1) {
		top: 9px;
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	.area_renewal .active .accordion_icon span:nth-of-type(1){
		display: none;
	}
	.area_renewal .accordion_icon span:nth-of-type(2) {
		top: 9px;
		-webkit-transform: rotate(90deg);
		transform: rotate(90deg);
	}
	.area_renewal .active .accordion_icon span:nth-of-type(2){
		-webkit-transform: rotate(180deg);
    	transform: rotate(180deg);
	}


	/* -----------------------------------------------------------
		INDEX
	-------------------------------------------------------------- */
	.area_index{
		margin: 40px 0 0 0;
		padding: 0px 20px;
	}
	.area_index .inner{
		display: block;
		padding: 20px 10px 20px 25px;
	}
	.area_index .title.f_roboto {
		width: 100%;
		font-size: 140%;
    	margin: 0 0 10px 0;
	}
	.area_index .list_index{
		display: block;
		padding: 0;
	}
	.area_index .list_index li,
	.area_index .list_index li:nth-child(n+4){
		width: 100%;
		margin: 0 0 5px 0;
	}
    .area_index .list_index li:first-child,
    .area_index .list_index li:nth-child(4),
	.area_index .list_index li:nth-child(5),
	.area_index .list_index li:nth-child(6){
        width: 100%;
    }

	.area_index .list_index li a::after {
		font-size: 1.2rem;
	}
	.area_index .list_index li.list{
		list-style: none;
		padding: 0;
		margin: 0;
	}


	/* -----------------------------------------------------------
		30プランと制作実績バナー
	-------------------------------------------------------------- */

	.area_topBtn{
		padding: 0 10px;
		margin: 30px 0 0 0;
	}
	.area_topBtn .inner{
		display: block;
	}
	.area_topBtn a{
		display: block;
		margin: 0 0 15px;
	}
	/*
	.area_topBtn a:nth-child(1){
		margin: 0 0 20px 0;
	}
	*/

	/* -----------------------------------------------------------
    	オーダーメイドホームページ制作
	-------------------------------------------------------------- */
	.area_ordermade {
		padding: 15px 20px;
	}
	.area_ordermade h2.title {
		font-size: 18px;
		margin: 0 0 15px 0;
	}
	.area_ordermade p.txt{
		text-align: left;
		margin: 0 0 20px 0;
	}
	.area_ordermade ul{
		display: block;
	}
	.area_ordermade ul li {
		width: 100%;
		margin: 0 0 10px 0;
	}
	.area_ordermade ul li:nth-child(2n) {
		margin: 0 0 10px 0;
	}
	.area_ordermade ul li h3{
		width: 100%;
		font-size: 16px;
		line-height: 1.3;
		min-height: 35px;
		padding: 5px 0 0 0;
		margin: 0 0 5px 0;
	}
	.area_ordermade ul li h3.row1{
		line-height: 40px;
	}
	.area_ordermade ul li h3.sp_row2{
		padding: 0;
	}
	.area_ordermade ul li .wrapper{
		display:block;
	}
	.area_ordermade ul li .wrapper img {
	}
	.area_ordermade ul li .wrapper .area_left{
		width: 50px;
		padding: 20px 10px 0 10px;
		float: left;
	}
	.area_ordermade ul li .wrapper .area_right {
		width: 100%;
		padding: 20px 10px;
		box-sizing: border-box;
	}
	.area_ordermade ul li a {
		margin: 10px 0 0 auto;
	}
	/*東京ブランドパートナー*/
	.area_ordermade ul li.andtokyo .wrapper{
		min-height: auto;
    	padding: 20px 0;
	}
	.area_ordermade ul li.andtokyo .wrapper img{
		width: 280px;
	}
	.area_ordermade ul li.andtokyo h4{
		font-size: 15px;
		line-height: 1.4;
		padding: 0;
		margin: 0;
	}


	/* -----------------------------------------------------------
		30プランバナー
	-------------------------------------------------------------- */

	.bn_30plan {
		margin: 0 0 30px 0;
	}


	/* -----------------------------------------------------------
		お問い合わせ内容 TOP5
	-------------------------------------------------------------- */

	.area_faq {
		padding: 40px 0 30px 0;
	}
	.area_faq h3.title {
		font-size: 18px;
		margin: 0 0 15px 0;
	}
	.area_faq h3.title span {
		font-size: 23px;
	}
	.area_faq p.txt{
		text-align: left;
		margin: 0 0 20px 0;
	}
	.area_faq ul {
		display: block;
	}
	.area_faq ul li{
		width:100%;
	}
	.area_faq ul li a .wrapper{
		width: 100%;
		padding: 25px 10px 25px 15px;
	}
	.area_faq ul li a .wrapper::before{
		display: none;
	}
	.area_faq ul li a img{
		right: 0;
	}
	.area_faq ul li p.number {
		margin: 0 15px 0 0;
	}
	.area_faq ul li p.title {
		width: calc(100% - 40px - 16px);
		font-size: 16px;
	}



	/* -----------------------------------------------------------
		採用バナー
	-------------------------------------------------------------- */

	.bn_recruit {
		margin: 5px 20px 0;
		padding: 0 0 20px;
		width: auto;
	}
	.bn_recruit img {
		width: 100%;
		max-width: 480px;
		height: auto;
	}


	/* -----------------------------------------------------------
		BLOG
	-------------------------------------------------------------- */

	.area_blog {
		margin: 0;
		/*padding: 40px 0;*//*コンテンツ入ったら戻す*/
		padding: 0 0 40px 0;
	}
	.area_blog .inner {
    padding: 0px 20px;
}

	.area_blog p.title.f_roboto {
		font-size: 180%;
		margin: 0;
	}
	.area_blog p.title.f_roboto::after {
		width: 40px;
		height: 1px;
		margin: 10px auto 0;
	}
	.area_blog .catch{
		padding: 20px 0 0;
		font-size: 110%;
		font-weight: bold;
		line-height: 1.6;
	}

	.area_blog .txt {
		margin: 15px 0 0;
		text-align: left;
	}

	.list_blog {
		margin: 15px 0 0;
		border-top:none;
	}

	.list_blog li {
		margin: 0;
		width: 100%;
		background: url(../img/sp_icon_arrow02.png) no-repeat 95% 50% / 17px 17px;
	}

	.list_blog li:nth-child(n+3){
		display: none;
	}

	.list_blog li:first-child, .list_blog li:nth-child(4n+1) {
		margin: 0;
	}

	.list_blog li a {
		display: block;
		width: 100%;
		padding: 15px 25px 15px 15px;
		border:none;
		border-top: 1px solid #E4E6E9;
		min-height:inherit;
		box-sizing: border-box;
	}

	.list_blog li a:hover {
		border:none;
		border-top: 1px solid #E4E6E9;
	}

	.list_blog li:nth-child(2) a,
	.list_blog li:nth-child(2) a:hover {
		border-bottom: 1px solid #E4E6E9;
	}
	.list_blog .blog_title {
		margin: 10px 0 0;
		width: 100%;
		letter-spacing: 0.05em;
	}

	.area_blog .btn {
		display: block;
		margin: 20px 0 0;
		text-align: center;
	}

	.area_blog .btn a {
		width: 100%;
		font-weight: normal;
	}



	/* -----------------------------------------------------------
		OUR SERVICES
	-------------------------------------------------------------- */

	.area_services {
		margin: 0;
		padding: 40px 0 30px 0;
		/*background: #fff;*/
	}
.area_services .inner {
    padding: 0px 20px;
}
	.area_services .title.f_roboto {
		font-size: 180%;
		margin: 0;
	}
	.area_services .title.f_roboto::after {
		width: 40px;
		height: 1px;
		margin: 10px auto 0;
	}
	.area_services .catch{
		padding: 20px 0 0;
		font-size: 105%;
		font-weight: bold;
		line-height: 1.6;
	}

	.area_services .txt_top {
		margin: 15px 0 20px 0;
		text-align: left;
		font-size: 95%;
	}

	/*          ホームページ制作          */

	.area_services .area_services_homepage {
		margin: 0;
	}

	.area_services .area_services_system {
		padding: 0;
	}


	/* -----------------------------------------------------------
		WORKS
	-------------------------------------------------------------- */

	.area_works {
		/*padding: 40px 0 ;
		border-top: 1px solid #E1E1E1;*/
		padding: 0 0 40px;
	}
	.area_works .inner {
    padding: 0px 20px;
}

	.area_works .title.f_roboto {
		font-size: 180%;
		margin: 0;
	}
	.area_works .title.f_roboto::after {
		width: 40px;
		height: 1px;
		margin: 10px auto 0;
	}
	.area_works .catch{
		padding: 20px 0 0;
		font-size: 110%;
		font-weight: bold;
		line-height: 1.6;
	}

	.area_works .txt {
		margin: 15px 0 0;
		text-align: left;
	}

	.area_works .list_works {
		margin: 5px auto 0;
		width: 100%;
	}

	.area_works .list_works li {
		float: left;
		margin: 15px 0 0 0;
		width: 48%;
		max-width: 215px;
		box-sizing: border-box;
	}

	.area_works .list_works li:nth-child(even) {
		float: right;
	}

	.area_works .list_works li:nth-child(3n+1) {
		margin: 15px 0 0 0;
	}

	.area_works .list_works li:first-child, .area_works .list_works li:nth-child(2n+1) {
		margin: 15px 0 0 0;
	}

	.area_works .list_works li img {
		width: 100%;
		height: auto;
	}

	.area_works figure {
		position: relative;
		overflow: hidden;
		width: 100%;
		margin: 0;
	}

	.area_works figcaption {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 2;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,.6);
		-webkit-transition: .3s;
		transition: .3s;
		opacity: 0;
	}

	.area_works figure:hover figcaption {
		opacity: 1;
	}

	.area_works .transform {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}

	.area_works figure:hover .transform {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
	}

	.area_works figure h3 {
		padding: 10px 5px 5px 5px;

		line-height:1.4;
		color: #fff;
		font-size: 70%;
	}

	.area_works figure p {
		font-size: 70%;
		line-height:1.4;
	}
	.area_works .btn {
		display: block;
		margin: 20px 0 0;
		text-align: center;
	}
	.area_works .btn a {
		width: 100%;
		padding: 15px 20px;
		font-size: 16px;
		font-weight: bold;
		/*border: 2px solid #332E2C;*/
		margin: 0;
	}
	.area_works .btn a:hover {
		/*border: 2px solid #3F86C6;*/
	}
	.area_works .btn a:first-child{
		margin: 0 0 15px 0;
	}


	/* -----------------------------------------------------------
		RECRUIT
	-------------------------------------------------------------- */
	.area_recruit{
		padding: 0 0 40px 0;
		margin: 0;
		position: relative;
		/*
		background: #EEF0EF;
		*/
		background: #fff;
	}
.area_recruit .inner {
    padding: 0px 20px;
}
	
	.area_recruit::before {
		display: none;
	}
	.area_recruit .img_recruit {
		position: static;
		width: 100%;
		margin: 0 0 30px 0;
	}
	.area_recruit .title {
		font-size: 180%;
		font-weight: bold;
		text-align: center;
		margin: 0 0 15px 0;
	}
	.area_recruit h2.catch {
		font-size: 18px;
		margin: 0 0 15px 0;
		text-align: center;
	}
	.area_recruit p.txt {
		margin: 0 0 40px 0;
	}
	.area_recruit .btn_entry a, .area_recruit .btn_green a, .area_recruit .btn_mynavi a{
		width: 100%;
		height: 50px;
	}
	.area_recruit .btn_entry a{
		padding: 15px 20px;
		font-size: 16px;
		/*margin: 0 0 60px 0;*//*マイナビ掲載時*/
		margin: 0 0 52px 0;/*マイナビ掲載時*/
	}
	.area_recruit .btn_entry a img{
		right: calc((100% / 2) - 130px);
	}
	.area_recruit .btn_mynavi a{
		margin: 0 0 50px 0;
	}
	.area_recruit .btn_mynavi a img.mynavi01{
		height: 24px;
    	top: 10px;
	}
	.area_recruit .btn_mynavi a img.mynavi02{
		right: calc((100% / 2) - 132px);
	}
	.area_recruit .btn_green a img.green01{
		width: 180px;
		bottom: 10px;
    	left: calc((100% / 2) - 120px);
	}
	.area_recruit .btn_green a img.green02{
		right: calc((100% / 2) - 138px);
	}

}

/* -----------------------------------------------------------
    w320対応
-------------------------------------------------------------- */
@media screen and (max-width:320px){
	.title_renewal{
		font-size: 17px;
	}
	.area_ordermade ul li h3 {
		font-size: 15px;
	}
	.area_ordermade ul li a {
		font-size: 13.5px;
	}


	.area_ordermade ul li.andtokyo h4{
		font-size: 14px;
	}
	.area_services .catch {
		font-size: 14.5px;
	}
	.area_works .catch {
		font-size: 100%;
	}
}


/* -----------------------------------------------------------
		header
	-------------------------------------------------------------- */

	#area_catch {
		/*
		display: none;
		*/
		display: block;
		position: relative;
		top: 60px;
		width: 100%;
		height: auto;
		z-index: 5;
		background: #687A81;
	}
	#area_catch.form_nav {
		top: 100px;
	}
	#area_catch.work_nav {
		/*top: 120px;*/
		top: 60px;
	}
	
	#h1 {
		position: inherit;
		width: auto;
		margin: 0 auto;
		
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		line-height: 1.2;
		padding: 5px;
	}

	#h1 .catch{
		display: block;
		position: inherit;
		top: auto;
		left: auto;
		font-size: 10px;
		letter-spacing: 0;
		z-index:101;
		
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	
	
	#header {
		position:fixed;
		top: 0;
		z-index:100;
		height: auto;
	}

	#header.fixed {
		position: fixed;
		left: 0;
		top: 0;
		z-index:100;
		background: rgba(255,255,255,0.9);
	}
	
	#header .bg_header {
		width: 100%;
		height: 60px;
		top: 0;
		background: #eeeeee;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	#header .bg_header .inner {
		background: none;
		width: 100%;
	}
	
	#header p {
		width: 20%;
		margin: 0;
	}

	#header p img {
		width: 58px;
	}
	
	#header p a {
		display: inline;
	}
	

	/*          header menu          */
	
	
	#header .sp_header {
		display: inline-block;
		width: 20%;
	}

	#header .sp_header table {
		width: 100%;
		margin:0;
		padding:0;
		border: 0;
	}

	#header .sp_header table td {
		width: 25%;
		height: 58px;
		border-left: 1px solid #3D5663;
		border-right: 1px solid #071A23;
		background: #071A23;
		border: 0;
	}

    #header .sp_header table td.first_price {
		width: 27%;
		border-left: none;
		padding:0 5px 0 0;
		border: 0;
	}
    
	#header .sp_header table td.first {
		width: 22%;
        /*
		border-left: none;
		padding:0 5px 0 0;
        */
	}

	#header .sp_header table td.second {
		width: 28%;
	}

	#header .sp_header table td.third {
		width: 24%;
	}
	
	#header .sp_header table td.last {
		border-right: none;
		text-align: center;
	}

	#header .sp_header table td a {
		display: block;
		width: 100%;
		padding: 0px 0px;
		font-size: 60%;
		font-weight: bold;
		color: #fff;
		text-align: center;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

    #header .sp_header table td.first_price .price_s {
        width: 100%;
        color: #FAE738;
	}
    #header .sp_header table td.first_price .price_b {
        width: 100%;
        line-height: 1.3;
        padding: 5px 0 0;
	}
    #header .sp_header table td.first_price a {
		padding: 0px 0px;
	}
    
	#header .sp_header table td.second a {
		letter-spacing: -0.05em;
	}

	#header .sp_header .icon.works02 {
		margin: 2px 0 11px;
		width: 21px;
		height: 15px;
		background-size: 21px 15px;
	}


	#header .sp_header .icon.h_30plan02 {
		margin: 2px 0 8px;
		width: 26px;
		height: 18px;
		background-size: 26px 18px;
	}

	#header .sp_header .icon.ask02 {
		margin: 2px 0 8px;
		width: 21px;
		height: 18px;
		background-size: 21px 18px;
	}

	/*#header .sp_header ul {
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
	}

	#header .sp_header li {
		height: 60px;
		border-left: 1px solid #3D5663;
		border-right: 1px solid #000;
	}

	#header .sp_header li:first-child {
		border-left: none;
	}

	#header .sp_header li:last-child {
		border-right: none;
	}

	#header .sp_header li a {
		display: block;
		padding: 1em 1em;
		font-size: 60%;
		font-weight: bold;
		color: #fff;
		text-align: center;
	}

	#header .sp_header li:nth-child(2) a {
		letter-spacing: -0.05em;
	}

	#header .sp_header .icon.works {
		margin: 2px 0 11px;
	}

	#header .sp_header .icon.h_30plan02 {
		margin: 2px 0 8px;
	}

	#header .sp_header .icon.consul {
		margin: 2px 0 8px;
	}

	#header .sp_header .icon.menu {
		margin: 4px 0 11px;
	}*/


	/* -----------------------------------------------------------
		MENU開閉用ボタン
	-------------------------------------------------------------- */

	.menu-btn {
		display: inline-block;
		position: fixed;
		top: 0;
		right: 0;
		width: 20%;
		height: 60px;
		font-size: 70%;
		font-weight: bold;
		text-align: center;
		cursor: pointer;
		z-index: 102;
	}

	.menu-btn .icon {
		margin: 12px 0 0 2px;
		width: 16px;
		height: 14px;
		background: url(control/img/icon_menu01.png) no-repeat left top / 16px 14px;
	}
	
	.menu-btn .txt {
		display: inline-block;
		margin: 7px 0 0 2px;
		color: #fff;
	}
	
	.menu-btn span.txt:after {
		content: attr(data-txt-menu);
	}
	
	 /*開閉用ボタンがクリックされた時のスタイル */
	.open .menu-btn span.txt:after {
		content: attr(data-txt-close);
	}

	/* -----------------------------------------------------------
		モーダルウィンドウ
	-------------------------------------------------------------- */

	.sp_menu {
		position: fixed;
		/*display: table;*/
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,.85);
		-webkit-transition: all .5s;
		transition: all .5s;
		visibility: hidden;
		opacity: 0;
		z-index: 101;
	}

	.sp_menu .wrap_scroll {
		position: relative;
		width: 100%;
		height: 100%;
		overflow-y: scroll;
		/*-webkit-overflow-scrolling: touch;*/
		z-index: 105;
	}

	.sp_menu ul {
		position: relative;
		display: table-cell;
		vertical-align: middle;
		width: 100%;
		padding: 30px 0 70px 0;
	}
	
	
	.sp_menu ul li{
	}
	
	.sp_menu ul li.menu_title_top {
		padding:0;
		border-top:1px #666 dotted;

		-webkit-box-sizing: border-box;	
		-moz-box-sizing: border-box;	
		box-sizing: border-box;
	}
	
	.sp_menu ul li.menu_title_top:first-child {
		border-top:none;
		padding:0 0 10px 0;
	}
	
	.sp_menu ul li.menu_title_top:nth-of-type(2) .title_sp_menu{
		padding: 15px 0 0 0;
	}

	.sp_menu ul li.menu_title_top .f_con {
		margin: 0 10px 0 0;
	}
	
	.sp_menu ul li .title_sp_menu {
		margin:0;
		padding:15px 0;
	}
	.sp_menu ul li .title_sp_menu.no_link {
		margin:0;
		padding:25px 0 15px 10px;
		color: #fff;
	}

	.sp_menu ul li .title_sp_menu a {
		display: block;
		padding: 10px;
		width: 100%;
		color: #fff;
	}

	.sp_menu ul li .title_sp_menu {
	}
	
	.sp_menu ul li .list_sp_menu_child {
		padding: 0 0 15px 0;
	}
	
	.sp_menu ul li .list_sp_menu_child li {
		font-size: 90%;
		line-height: 1;
		border-top:none;
	}

	.sp_menu ul li .list_sp_menu_child li a {
		display: block;
		padding: 10px;
		width: 100%;
		color: #fff;
	}




	/*
	.sp_menu li {
		float: left;
		width: 100%;
		line-height: 1.8;
		margin: 0 auto;
		text-align: center;
	}
	
	.sp_menu li a {
		display: block;
		padding: 25px 0;
		width: 100%;
		font-size: 110%;
		color: #fff;
	}
	*/
	
		
	/* 開閉用ボタンがクリックされた時のスタイル */
	.open .sp_menu {
		/*cursor: url(../images/cross.svg),auto;*/
		-webkit-transition: all .5s;
		-moz-transition: all .5s;
		-o-transition: all .5s;
		transition: all .5s;
		visibility: visible;
		opacity: 1;
	}		


	.open .sp_menu li {
		opacity: 1;
        line-height: 1.4;
	}
	
	.open .sp_menu li:nth-child(1) {
		-webkit-transition: opacity 1s ease .5s;
		-moz-transition: opacity 1s ease .5s;
		-o-transition: opacity 1s ease .5s;
		transition: opacity 1s ease .5s;
	}
	
	.open .sp_menu li:nth-child(2) {
		-webkit-transition: opacity 1s ease .6s;
		-moz-transition: opacity 1s ease .6s;
		-o-transition: opacity 1s ease .6s;
		transition: opacity 1s ease .6s;
	}
	
	.open .sp_menu li:nth-child(3) {
		-webkit-transition: opacity 1s ease .7s;
		-moz-transition: opacity 1s ease .7s;
		-o-transition: opacity 1s ease .7s;
		transition: opacity 1s ease .7s;
	}
	
	.open .sp_menu li:nth-child(4) {
		-webkit-transition: opacity 1s ease .8s;
		-moz-transition: opacity 1s ease .8s;
		-o-transition: opacity 1s ease .8s;
		transition: opacity 1s ease .8s;
	}
	
	.open .sp_menu li:nth-child(5) {
		-webkit-transition: opacity 1s ease .9s;
		-moz-transition: opacity 1s ease .9s;
		-o-transition: opacity 1s ease .9s;
		transition: opacity 1s ease .9s;
	}
	
	
	
	/* -----------------------------
		nav
	-------------------------------- */
	
	#nav {
		display: none;
	}	

	#mdd_nav_wrap {
		display: none;
	}

.icon.works02 {
	background: url(control/img/icon_works02.png) no-repeat;
}

.icon.h_30plan02 {
	background: url(control/img/icon_30plan02.png) no-repeat;
}
.area_ask .box_txt img {
    width: 100%;
}

.title.f_roboto {
	font-size: 18px !important;
	font-weight: bold;
	text-align: center;
}

.inner.wrap15 .catch {
	font-size: 16px !important;
}

.interview_card_body .card_title {
	font-size: 14px !important;
}

.title.f_roboto {
	padding-top: 15px;
}

.area_ask .box_txt .title {
	font-size: 18px !important
}

.wrap15 .catch {
	text-align: center !important;
}

.area_renewal .inner .txt_renewal p {
	font-size: 14px;
}

.area_menu-btn.sp_display_b #js__btn .txt {
	padding-bottom: 20px;
}

.area_menu-btn.sp_display_b #js__btn .txt {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin: 0;
padding: 0;
	font-size:15px;
}

.responsive-image {
  max-width: 100%;
  height: auto;
}

.image-link, .image-link:visited, .image-link:hover, .image-link:active {
  text-decoration: none; /* リンクの下線を消去 */
}

.image-container img {
  width: 100%;
  height: auto;
}