@charset "UTF-8";
/*
	Theme Name: 	artbuild
	Description:	artbuild用テーマ
	Theme URI: 		http://artbuild.jp
	Author:			Kazunari Matsumoto
	Author URI:		http://raizzenet.com/
	Version:		1.0.0
	License:		GNU General Public License
	License URI:	http://www.gnu.org/licenses/gpl-2.0.html
*/
* {
	margin:0;
	padding:0;
	text-decoration:none;
}

body {
	max-width: 1000px;
	font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, sans-serif;
	font-size:16px;
	margin:0 auto;
	color: #383838;
	background: #FFFADD;
}
h1,h2,h3,h4,h5,h6 {
	line-height: 1.3;
}

p {
	font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", serif;
}

@media only screen and (max-width: 768px) {body { width: 768px; }}
@media only screen and (max-width: 640px) {body { width: 640px; }}
@media only screen and (max-width: 600px) {body { width: 600px; }}
@media only screen and (max-width: 568px) {body { width: 568px; }}
@media only screen and (max-width: 540px) {body { width: 540px; }}
@media only screen and (max-width: 480px) {body { width: 480px; }}
@media only screen and (max-width: 440px) {body { width: 440px; }}
@media only screen and (max-width: 428px) {body { width: 428px; }}
@media only screen and (max-width: 414px) {body { width: 414px; }}
@media only screen and (max-width: 400px) {body { width: 400px; }}
@media only screen and (max-width: 390px) {body { width: 390px; }}
@media only screen and (max-width: 384px) {body { width: 384px; }}
@media only screen and (max-width: 375px) {body { width: 375px; }}
@media only screen and (max-width: 360px) {body { width: 360px; }}
@media only screen and (max-width: 320px) {body { width: 320px; }}

img {
	width: 100%;
	height: auto;
}
a {
	text-decoration: none;
	color: #383838;
}
ul {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	list-style-type: none;
}
address {
	margin: 8px 0;
	padding: 0;
}
h1 {
	font-size: 32px;
	font-weight: 700;
	margin: 0px 0 32px 0;
	padding: 12px 16px;
	text-align: center;
}
h2 {
	font-weight: 400;
	margin: 0px 0 16px 0;
	padding: 8px 16px;
	text-align: center;
	border-radius: 10px;
	background: #f1d052;
	color: #fff;
	clear: both;
}
h3 {
	font-weight: 400;
	margin: 32px 0 16px 0;
	padding: 4px 0;
	border: 1px solid #e3b023;
	border-radius: 10px;
}
h4 {
	font-weight: 400;
	margin: 8px 0;
	padding: 0;
	padding: 0px;
}
p {
	line-height: 1.7em;
	margin: 0 0 24px 0;
	padding: 0;
}
table {
	width: 90%;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 16px 5%;
	padding: 0;
}
th {
	width: 30%;
	border: 1px solid #ededed;
	font-weight: normal;
	text-align: center;
	text-transform: uppercase;
	vertical-align: middle;
	padding: 12px 16px;
	margin: 0;
}
td {
	width: 70%;
	vertical-align: middle;
	padding: 12px 16px;
	margin: 0;
	border: 1px solid #ededed;
}

.alignright {
	box-sizing: border-box;
	padding: 0 0 0 16px;
	float: right;
}
.alignleft {
	box-sizing: border-box;
	padding: 0 16px 0 0;
	float: left;
}
.aligncenter {
	margin: 0 auto;
	clear: both;
	display: block;
}
.strikethrough {
	text-decoration: line-through;
}
.children {
	padding-left: 40px;
}
.caution {
	font-weight: bold;
	color: #ff0000;
}
#wrapper {
	box-sizing: border-box;
	width: 100%;
	padding: 0 12px;
/*	padding: 0 5%;*/
	display: inline-block;
	background: #fff;
}
#main {
	box-sizing: border-box;
	width: 72%;
/*	width: 80%;*/
	padding: 8px 8px 0 0;
	float: left;
}
#side {
	box-sizing: border-box;
	width: 27%;
/*	width: 19%;*/
	margin: 0;
	padding: 12px 0 0 24px;
	float: right;
}
@media only screen and (max-width: 640px) {
	#wrapper { padding: 0 8px; }
	#main { width: 100%; padding: 0; clear: both; }
	#side { width: 100%; clear: both; padding: 32px 0;}

}
.contents, .post-contents, .blog-contents {
	box-sizing: border-box;
	width: 100%;
	margin: 4px 0 80px 0;
	clear: both;
	display: block;
}
.contents .area, .contents .area2, .contents .area-t{
	box-sizing: border-box;
	display: flex;
}
.contents .area-t {
	margin-top: 32px;
}
.contents .area p, .contents .area2 p, .contents .area-t p {
	padding-right: 16px;
}
@media only screen and (max-width: 480px) {
	.contents .area, .contents .area-t {
		flex-direction: column-reverse;
	}
	.contents .area2 {
		flex-direction: column;
	}
	.contents .area p, .contents .area2 p, .contents .area-t p {
		padding-right: 8px;
	}
}
.contents .area3 {
	width: 100%;
	text-align: center;
	display: flex;
	justify-content: space-between;
}
.contents .area3 p {
	width: 47%;
	padding: 16px 0;
	border-radius: 10px;
	border: 1px dotted #aaa;
}

.contents h2 {
	font-size: 28px;
	margin: 60px 0 24px;
	padding: 8px 8px;
}
.contents h2:first-of-type {
	margin: 32px 0 24px;
}
.index-number {
	counter-reset: list-counter; /* カウンターを初期化 */
}

.index-number h2 {
	counter-increment: list-counter; /* h2ごとにカウンターを増やす */
	text-align: left;
	border: none;
	color: #383838;
	background: #fff;
}

.index-number h2::before {
	content: counter(list-counter) "   "; /* 番号を表示 */
	width: 36px;
	height: 36px;
	margin-right: 8px;
	padding-top: 1px;
	padding-left: 10px;
	padding: 5px 1px 5px 10px;
	background-color: #E68126;
	border-radius: 50%;
	text-align: center;
	box-sizing: border-box;
	color: #fff;
}

.contents h3 {
	border: none;
}
.h3box h3 {
	padding: 8px 16px;
	color: #fff;
	background: #f1d052;
}
.contents p, .post-contents p, .blog-contents p {
	font-family: serif;
}
.contents .waku-line, .contents .waku-dot, .contents .waku-line2 {
	box-sizing: border-box;
	width: 100%;
	padding: 16px;
	border-radius: 10px;
}
.contents .waku-line {
	border: 1px solid #F09035;
}
.contents .waku-line2 {
	box-sizing: border-box;
	width: 100%;
	margin: 32px 0 8px;
	padding: 16px 16px 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	border-radius: 14px;
	background: #e8f5e9;
}
.contents .waku-line2 .btn {
	display: inline-block;
	padding: 12px 16px;
	border-radius: 999px;
	background: #00b900;
	color: #fff;
}
.contents .waku-line2 .big {
	font-size: 1.3rem;
	font-weight: bold;
}
.contents .waku-line2 .big2 {
	font-size: 2rem;
	font-weight: bold;
	line-height: 1.7;
}
@media only screen and (max-width: 480px) {
	.contents .waku-line2 {
		padding: 16px 16px 20px;
		justify-content: center;
	}
	.contents .waku-line2 .big2 {
		font-size: 1.8rem;
	}
}
.contents .waku-dot {
	border-width: 1.5px;
	border: 1px dashed #383838;
}
.contents .waku-line p, .contents .waku-dot p {
	margin-bottom: 8px;
}
.contents .txt-red {
	color: #ff0000;
}
.contents .txt-orange {
	color: #F09035;
}
.contents .txt-green {
	color: #457B3B;
}
.contents .txt-green2 {
	color: #00b900;
}
.contents .txt-small {
	font-size: 0.9rem;
}
.contents .txt-big {
	font-size: 1.2rem;
	font-weight: bold;
}
.contents .txt-big2 {
	font-size: 2.0rem;
	font-weight: bold;
}
.contents .txt-list ul {
	list-style:disc;
	padding-left: 16px;
	margin-bottom: 16px;
}
.contents .txt-list ul li {
	margin-bottom: 8px;
}
.contents .txt-list a {
	text-decoration: underline;
}

.toc {
	padding: 24px 16px 40px 16px;
}
.blog img {
	max-width: 100%;
	width: auto;
	height: auto;
}
.widget-side  {
	margin: 0 8px 8px 8px;
	padding: 0 0 8px 0;
}
.widget-side h2 {
	font-size: 18px;
	margin: 0;
	padding: 8px 16px 8px 16px;
}
.widget-side h3 {
	font-size: 15px;
	margin: 0 0 0px 0;
	padding: 4px 0px 4px 16px;
}
widget-side p {
	margin-top: 0;
}
.widget-side ul {
	list-style: none;
}
.widget-side li {
	margin: 10px 0 16px 0;
	display: block;
}
.widget-side li a {
	width: 100%;
	color: #383838;
	display: block;
}
.widget-side .cat-item  a {
	width: 100%;
	color: #383838;
	display: inline;
}
.widget-side li a:hover {
	text-decoration: underline;
	opacity: 0.6;
}
.widget-side .thumb {
	text-align: center;
}
.widget-side .thumb img {
	width: auto;
	max-height: 150px;
}
.widget-side .meta {
	font-size: 12px;
	margin: 2px 0 2px 0;
}
.widget-side .title {
	font-size: 14px;
	margin: 0px 0 2px 0;
	line-height: 1.0;
}
.widget-side input {
	line-height: 1.7;
}
.widget-side input[type=submit] {
	padding: 8px;
}
#header {
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 0;
	display: inline-block;
	background: #FAF5F0;
}
#header img {
	box-sizing: border-box;
	width: auto;
	height: auto;
	padding: 2px 8px;
}
#header h1 {
	font-size: 14px;
	padding: 0 8px;
	margin: 0;
	text-align: left;
}
#logo {
	font-size: 32px;
	font-weight: 800;
}
#shop-info-box {
	text-align: right;
	padding: 8px;
	float: right;
	line-height: 1.2;
}
.top-tel {
	box-sizing: border-box;
	font-size: 26px;
	margin: 0;
	padding-left: 26px;
	position: relative;
	display: block;
}
.top-tel:before {
	content: '';
	display: inline;
	position: absolute;
	width: 32px;
	height: 32px;
	margin-left: -26px;
	top: 3px;
	background: url(https://artbuilt.jp/wp-content/themes/artbuild/images/tel.png) no-repeat;
}
.top-tel a:hover {
	color: red;
	opacity: 0.6;
}
.biz-time {
	font-size: 12px;
}
@media only screen and (max-width: 480px) {
	#header h1 { font-size: 12px; }
	#header #logo { text-align: center; }
	#header img {width: 75%; height: auto; }
	.top-tel {
		text-align: center;
		padding: 8px 20px 8px 46px;
	}
	.top-tel:before {top: 10px;}
}
@media only screen and (max-width: 640px) {
	#logo { font-size: 28px; display: block; float: none;}
	#shop-info-box {
		display: none;
		//text-align: left;
		//float: left;
	}
}
@media only screen and (max-width: 320px) {
	#logo { font-size: 26px;}
}

#sp-top-menu-box {
	width: 100%;
	height: 36px;
	margin: 0 0 6px 0;
	padding: 8px;
	display: none;
}
#sp-top-menu {
	width: 100%;
	position: fixed;
	z-index: 10;
	top: 0;
	left: 0;
	background: #fff;
}
#sp-top-menu, #sp-top-menu a {
	font-weight: 600;
	color: #fff;
}
#sp-top-menu ul {
	width: 100%;
	font-size: 16px;
	font-weight: 600;
	list-style: none;
	display: flex;
}
#sp-top-menu ul li {
	box-sizing: border-box;
	margin: 0 0 6px 0;
	padding: 8px 0;
	text-align: center;
	border: 1px solid #000;
	box-shadow: 0px 3px 4px #000;
	flex-grow: 1;
}
#sp-top-menu ul li a {
	width: 100%;
	text-decoration: none;
}
#sp-top-menu ul li, #sp-top-menu ul li a {
	background: #fff;
	color: #666;
}
#sp-top-tel {
	cursor: pointer;
}
#sp-menu {
	cursor: pointer;
}
#sp-menu:after {
	content: '▼';
}
#sp-menu.close:after {
	content: '▲';
}
#toggle-menu {
	display: none;
}
@media only screen and (max-width: 480px) {
	#sp-top-menu-box { display: block; }
	#toggle-menu {
		box-sizing: border-box;
		width: 100%;
		position: fixed;
		top: 42px;
		left: 0;
		z-index: 20;
		padding: 0 0 16px 0;
		font-size: 20px;
		text-align: center;
		line-height: 2.5;
		box-shadow: 0px 3px 4px #000;
		background: #ffeeaa;
		background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
	}
	#toggle-menu a {
		text-decoration: none;
	}
	#toggle-menu #menu-header2 ul {
		font-size: 0;
		list-style: none;
	}
	#menu-header2 li a {
		width: 100%;
		font-size: 18px;
		font-weight: 600;
		padding: 16px 0;
		color: #666;
		text-align: center;
		display: block;
		text-decoration: none;
	}
}

#menu-header {
	box-sizing: border-box;
	width: 100%;
	font-size: 0;
	margin: 16px auto 0 auto;
	padding: 8px 0;
	list-style: none;
	text-align: center;
	display: inline-block;
	background: #ffeeaa;
	background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
}
#menu-header li {
	box-sizing: border-box;
	font-size: 16px;
	margin: 0 16px 0 16px;
	padding: 0;
	line-height: 1.3;
	display: inline-block;
}
#menu-header li a {
	width: 100%;
	text-decoration: none;
	margin: 0;
	padding: 6px 0px;
	display: block;
	color: #383838;
}
/*
#menu-header li a:after {
	content: '';
	width: 0;
	transition: all 0.3s ease;
	border-bottom: 3px solid #000;
	display: block;
}
*/
#menu-header li:hover {
	opacity: 0.6;
	background: #ffff00;
	background: linear-gradient(to bottom, #ffffff, #ffff00);
}
@media only screen and (max-width: 480px) {
	#menu-header {
		display: none;
	}
}




/*
#menu-toggle, #menu-open, #menu-close {
	display: none;
}

#menu-header {
	width: 100%;
}
#menu-header {
	box-sizing: border-box;
	width: 100%;
	font-size: 0;
	padding: 0;
	list-style: none;
	text-align: center;
	background: #ffeeaa;
	background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
	border-bottom: 1px solid #666;
	text-align:center;
	clear: both;
	display: block;
}
#menu-header li {
	box-sizing: border-box;
	width:16%;
	font-size: 15px;
	margin: 0;
	padding: 4px 8px;
	line-height: 1.3;
	display:inline-block;
}
#menu-header li a {
	width: 100%;
	text-decoration: none;
	margin: 0;
	padding: 8px 0px;
	display: block;
	color: #383838;
}
#menu-header li:hover {
	opacity: 0.6;
	background: #ffff00;
	background: linear-gradient(to bottom, #ffffff, #ffff00);
}

@media only screen and (max-width: 640px) {
	#menu-toggle {
		width: 52px;
		height: 48px;
		margin: 0px 8px 2px 4px;
		cursor: pointer;
		border: 1px solid  rgba(0,0,0,0.1);
		box-shadow: 1px 1px 1px #000;
		border-radius: 4px;
		text-align: center;
		float: right;
		display: block;
	}
	#menu-toggle:hover {
		color: #ff4388;
	}
	#menu-caption {
		font-size: 10px;
		padding-top: 4px;
		display: block;
	}
	#menu-open {
		position: relative;
		display: block;
		width: 28px;
		height: 28px;
		top: 6px;
		left: 12px;
		background: #383838;
	}
	#menu-open:before, #menu-open:after {
		position: absolute;
		left: 0;
		content: "";
		width: 100%;
		border-top: 6px solid #fff;
	}
	#menu-open:before {
		top: 5px;
	}
	#menu-open:after {
		bottom: 5px;
	}
	#menu-open.active {
		background: #fff;
	}
	#menu-open.active:before {
		border-top: 4px solid #000;
		-webkit-transform: translateY(8px) rotate(45deg);
		transform: translateY(8px) rotate(45deg);
	}
	#menu-open.active:after {
		border-top: 4px solid #000;
		-webkit-transform: translateY(-6px) rotate(-45deg);
		transform: translateY(-6px) rotate(-45deg);
	}
	#menu-header {
		display: none;
	}
	#menu-header li {
		width: 100%;
		background: #fff;
		border-bottom: 1px solid #ededed;
	}
}
*/


#pankuz {
	box-sizing: border-box;
	width: 100%;
	font-size: 14px;
	margin: 12px 0;
	display: block;
	clear: both;
}
@media only screen and (max-width: 640px) {
	#pankuz { padding: 8px; }
}

#top-image {
	box-sizing: border-box;
	width: 100%;
	height: calc(100vh - 200px);
	margin: 0 auto 16px;
	padding: 0;
	position: relative;
	overflow: hidden;
}
#top-image img {
	width: 100%;
	height: calc(100vh - 200px);
	object-fit: cover;
}
#top-image .flexslider .flex-top {
	width: 100%;
	height: auto;
	position: relative;
}
#top-image .flex-top .slides p {
	box-sizing: border-box;
	position: absolute;
	top: 200px;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 46px;
	font-weight: normal;
	line-height: 1.5;
	-webkit-text-stroke: 1px #ffffff;
	text-stroke: 1px #ffffff;
	color: #ffffff;
	text-shadow: 2px 3px 4px #000;
}
#top-image .flex-top .slide-btn {
	width: 100%;
	bottom: 100px;
	left: 50%;
    transform: translate(-50%, -50%);
	font-size: 24px;
	position: absolute;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}
#top-image .flex-top .slide-btn .box1 {
	padding: 8px 16px;
	border-radius: 5px;
	color: #fff;
	border: 1px solid #197339;
	background: #197339;
}
#top-image .flex-top .slide-btn .box2 {
	padding: 8px 16px;
	border-radius: 5px;
	color: #fff;
	border: 1px solid #E68126;
	background: #E68126;
}
#top-image .flex-top .slide-btn .title1,
#top-image .flex-top .slide-btn .title2,
#top-image .flex-top .slide-btn .title3 {
	color: #fff;
}
#top-image .flex-top .slide-btn .title1:before {
	position: relative;
	top: 2px;
	margin: 0 8px 0 0;
	content: url("https://artbuilt.jp/wp-content/themes/artbuild/images/tel1.png");
}
#top-image .flex-top .slide-btn .title2:before {
	position: relative;
	top: 2px;
	margin: 0 8px 0 0;
	content: url("https://artbuilt.jp/wp-content/themes/artbuild/images/line.png");
}
#top-image .flex-top .slide-btn .title3:before {
	position: relative;
	top: 5px;
	margin: 0 8px 0 0;
	content: url("https://artbuilt.jp/wp-content/themes/artbuild/images/mail.png");
}
#top-image .flex-top .slide-btn .box1:hover,
#top-image .flex-top .slide-btn .box2:hover {
	color: #383838;
}

@media only screen and (min-width: 1900px) {
	#top-image .flex-top .slides p {
		font-size: 48px;
	}
}
@media only screen and (max-width: 480px) {
	#top-image, #top-image img, #top-image .flex-top .slides {
		height: 75vh;
	}
	#top-image .flex-top .slides p {
		width: 100%;
		font-size: 32px;
		padding: 0;
		margin: 0;
		top: 25px;
		left: 0;
		transform: translate(0, 0);
		text-align: center;
	}
	#top-image .flex-top .slide-btn {
		width: 80%;
		font-size: 16px;
		flex-direction: column;
		bottom: -40px;
		left: 50%;
		transform: translate(-50%, -50%);
		text-align: center;
	}
}
.top-contents {
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 32px 0 80px;
	display: block;
	font-size: 18px;
}
.top-contents:first-of-type {
	padding: 32px 0 80px;
	font-size: 18px;
}
.index-wrapper {
	display: flex;
}
.index-wrapper h3 {
	margin: 0 0 16px;
	border: none;
}
.index-wrapper p {
	margin: 0 0 16px;
	border: none;
}

.circle_number {
	width: 50px;
	height: 50px;
	padding-top: 13px;
	border: 1px solid black;
	border-radius: 50%;
	text-align: center;
	box-sizing: border-box;
	background: #E68126;
}
.circle_number1 {
	width: 35px;
	height: 35px;
	padding-top: 5px;
	margin-right: 8px;
	background-color: #E68126;
	border-radius: 50%;
	text-align: center;
	box-sizing: border-box;
	font-weight: bold;
	color: #fff;
}
.circle-number2 {
	width: 24px;
	height: 24px;
	margin-right: 8px;
	padding-top: 2px;
	background-color: #197339;
	border-radius: 10px;
	text-align: center;
	box-sizing: border-box;
	font-weight: bold;
	color: #fff;
}

.img-txt {
	margin: 0 0 32px;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 32px;
}
.img-txt img {
	width: 60px;
	height: 50px;
	margin: 0 0 0 8px;
	padding: 0;
}
.img-txt h3 {
	margin: 0;
	padding: 16px 0 8px 0;
	border: none;
}
.img-txt p {
	margin: 0 0 8px;
	padding: 0;
}
.img-txt .icon {
	width: 50px;
	height: 50px;
	border-radius:50%;
	padding: 0 0 0 8px;
	fill: #2aa647;
}
.img-txt .icon svg {
	width: 35px;
	height: 35px;
}
.card-wrapper {
	width: 100%;
	margin: 32px auto;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	gap: 32px 16px;
}
.card-wrapper .card {
	box-sizing: border-box;
	width: calc(100% / 3 - 16px);
	height: auto;
	padding: 24px 12px;
	border: 1px solid #aaa;
	border-radius: 8px;
	display: flex;
	flex-direction: column;
}
.card-wrapper .card .index-wrapper {
	display: flex;
	flex-direction: row;
	justify-content: center;
}
.card-wrapper .card .index-wrapper h3 {
	margin: 0 0 16px 8px;
	padding: 0;
	text-align: center;
	border: none;
}
.card-wrapper .card .index-wrapper img {
	width: 24px;
	height: 24px;
}

.card-wrapper .card .box {
	box-sizing: border-box;
	padding: 0 8px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;                /* カードの高さを均等に伸ばす */
	justify-content: space-between;
}

.card-wrapper .card p {
	flex-grow: 2;
	margin: 0 0 16px;
	padding: 0;
}
@media only screen and (max-width: 480px) {
	.card-wrapper {
		flex-direction: row;
	}
	.card-wrapper .card {
		width: 100%;
	}
}

.goto-page {
	width: 100%;
	text-align: center;
	margin: 16px auto 0;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 1.2px;
	color: #fff;
	border: 1px solid #E68126;
	border-radius: 8px;
	background: #E68126;
	flex: 1;
}
.goto-page a {
	width: 100%;
	padding: 12px 0;
	text-decoration: none;
	color: #fff;
	display: block;
}
.goto-page a:hover {
	border-radius: 8px;
	box-shadow: 2px 2px 1px #666;
}

.top-contents .slider {
	width: 100%;
	text-align: center;
}
.slider-box {
	width: 150px;
	height: 260px;
	margin: 0 4px;
	border: 1px solid #666;
	overflow: hidden;
}
.top-contents .slider img {
	width: 100%;
	height: 200px;
	object-fit: cover;
}
@media only screen and (max-width: 480px) {
	.slider-box {
		width: 160px;
		height: 200px;
	}
	.top-contents .slider img {
		height: 100px;
	}
}
.top-contents .boxbox {
	box-sizing: border-box;
	width: 100%;
	display: flex;
	align-items: center;
}
.top-contents .boxbox .box1 {
	width: 60%;
}
.top-contents .boxbox .box2 {
	width: 40%;
}
.top-contents .boxbox .box2 img {
	width: 300px;
	max-height: 250px;
	margin: 0 24px;
	object-fit: cover;
}
@media only screen and (max-width: 480px) {
	.top-contents .boxbox .box1 {
		width: 60%;
	}
	.top-contents .boxbox .box2 {
		width: 40%;
	}
	.top-contents .boxbox .box2 img {
		width: 100%;
		max-height: auto;
		margin: 0 8px;
	}
}
.image-l { width: 50%;}
.image-l2 {width: 20%;}
.image-l3 {width: 30%;}
.image-l4 {width: 40%;}

.image-l, .image-l0, .image-l2, .image-l3, .image-l4 {
	height: auto;
	margin: 0 8px 8px 0;
	float: left;
}
.image-l img, .image-l0 img, .image-l2 img, .image-l3 img, .image-l4 img {
	border-radius: 10px;
}

.image-r { width: 50%;}
.image-r2 {width: 20%;}
.image-r3 {width: 30%;}
.image-r4 {width: 40%;}

.image-r, .image-r0, .image-r2, .image-r3, .image-r4 {
	height: auto;
	margin: 0 8px 8px 0;
	float: right;
}
.image-r img, .image-r0 img, .image-r2 img, .image-r3 img, .image-r4 img {
	border-radius: 10px;
}
.image-c { width: 50%;}
.image-c2 {width: 20%;}
.image-c3 {width: 30%;}
.image-c4 {width: 40%;}

.image-c, .image-c0, .image-c2, .image-c3, .image-c4 {
	height: auto;
	margin: 0 8px 8px 0;
	clear: both;
	text-align: center;
}
.image-c img, .image-c0 img, .image-c2 img, .image-c3 img, .image-c4 img {
	border-radius: 10px;
}


.photo img {
	border-radius: 10px;
}
.list-item3, .list-item4 {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	gap: 20px 16px;
}
.list-item3 .list {
	width: 31%;
/*	display: flex;
	flex-direction: column;
	flex-grow: 1;
*/
}
.list-item4 .list {
	width: 22%;
}
.list-item3 .list, .list-item4 .list {
	height: auto;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0px 2px 4px #aaa;
}
/*
.list-item4 .item-data {
	width: 100%;
	height: 100%;
}
*/
.list-item3 h2, .list-item4 h2 {
	font-size: 18px;
	margin: 0;
	padding: 0 8px;
	color: #383838;
	background: #fff;
}
.list-item3 h3, .list-item4 h3 {
	font-size: 16px;
	margin: 0;
	padding: 8px 8px 16px;
	border: none;
}
.list-item3 .date, .list-item4 .date {
	font-size: 12px;
	margin: 0;
	padding: 2px 8px 0;
}
/*.list-item4 .item-data .category {*/
.list-item3 .cat {
	font-size: 12px;
	text-align: right;
	padding: 4px 8px 8px 4px;
}
/*.list-item4 .item-data .photo {*/
.list-item3 .photo, .list-item4 .photo {
	width: 100%;
	height: 200px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	object-fit: cover;
}
/*.list-item4 .item-data .photo img {*/
.list-item3 .photo img, .list-item4 .photo img {
	width: 100%;
	height: 100%;
	border-radius: 8px 8px 0 0;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.list-item3 .list:hover, .list-item4 .list:hover {
	opacity: 0.6;
}
.list-item3 .list:hover img, .list-item4 .list:hover img {
	transform: rotateY(180deg);
}

@media only screen and (max-width: 640px) {
	.list-item4 .list {
		width: 45%;
	}
}
@media only screen and (max-width: 480px) {
	.list-item3, .list-item4 {
		flex-direction: column;
	}
	.list-item3 .list, .list-item4 .list {
		width: 100%;
	}
	.list-item3 .photo, .list-item4 .photo {
		width: 100%;
		height: 300px;
	}
}




.list-btn {
	box-sizing: border-box;
	width: 45%;
	margin: 10px auto 16px auto;
	text-align: center;
	vertical-align: middle;
	padding: 16px 0;
	background: #ffcc77;
	border: 1px solid #383838;
	box-shadow: 1px 1px 2px #555;
	border-radius: 10px;
	background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);

	display: inline-block;
	position: relative;
}
.list-btn h3 {
	font-size: 20px;
	margin: 0;
	padding: 0;
	border: none;
}
.list-btn .next {
	height: 50%;
	font-size: 14px;
	position: absolute;
	top: 75%;
	right: 18px;
}
.list-btn a:hover {
	color: red;
	opacity: 0.4;
	box-shadow: 0 1px #555;
}
@media only screen and (max-width: 480px) {
	.list-btn {
		width: 100%;
	}
}
.list-item-h {
	box-sizing: border-box;
	width: 100%;
	margin: 10px 0 16px 0;
	padding: 0;
	background: #fff;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.list-item-h .list {
	width: 100%;
	height: 140px;
	display: flex;
	border: 1px solid #aaa;
	border-radius: 10px;
	box-shadow: 0px 2px 4px #aaa;
}
.list-item-h .list .left {
	box-sizing: border-box;
	width: 40%;
	overflow: hidden;
	border-radius: 10px 0 0 10px;
}

.list-item-h .list .left img {
	width: 100%;
	height: 140px;
	margin: 0;
	padding: 0;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.list-item-h .list .right {
	width: 60%;
	text-align: center;
	line-height: 1.3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content:space-between;
}
.list-item-h .list .next {
	box-sizing: border-box;
	width: 100%;
	font-size: 14px;
	text-align: right;
	padding: 0 8px 8px 0;
}
.list-item-h .item-data {
	width: 100%;
	height: 100%;
}
.list-item-h h2 {
	font-size: 24px;
	margin: 0;
	padding: 8px;
	color: #383838;
	background: #fff;
}
.list-item-h .list h3 {
	font-size: 26px;
	margin: 0;
	padding: 0;
	padding-top: 40px;
	border: none;
}
.list-item-h .date {
	font-size: 12px;
	margin: 0;
	padding: 2px 8px;
}
.list-item-h .item-data .category {
	font-size: 12px;
	text-align: right;
	padding: 4px 8px 8px 4px;
}
.list-item-h .item-data .photo {
	width: 100%;
	height: 200px;
	overflow: hidden;
}
.list-item-h .item-data img {
	width: 100%;
	height: 100%;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.list-item-h .list:hover {
	opacity: 0.6;
}
.list-item-h .list:hover img {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}
@media only screen and (max-width: 480px) {
	.list-item-h h3 {
		font-size: 18px;
	}
	.list-item-h .next {
		font-size: 14px;
	}
	.list-item-h .left img {
		height: 100px;
	}
}
@media only screen and (max-width: 320px) {
	.list-item-h h3 {
		font-size: 15px;
	}
	.list-item-h .next {
		font-size: 12px;
	}
}
.long-btn {
	width: 100%;
	margin: 16px auto;
	border-radius: 10px;
	background: #54B03A;
	text-align: center;
}
.long-btn a {
	width: 100%;
	font-size: 18px;
	padding: 24px 0;
	color: #fff;
	display: block;
}
.long-btn a:hover {
	border-radius: 10px;
	box-shadow: 2px 2px 1px #666;
}
.my-photo {
	width: 30%;
	margin: 0 0 8px 8px;
	float:right;
}
.my-photo img {
	border-radius: 10px;
}

.cap-top { margin-top: 64px;}

.faq {
	background: #fff;
}
.faq h3 {
	margin-bottom: 0px;
	border: 1px solid #383838;
	border-radius: 10px 10px 0 0;
}
.faq-q { color: red; }
.faq-a { color: blue; font-size: 20px; }
.faq p {
	width: 100%;
	box-sizing: border-box;
	border: 1px solid #383838;
	border-top: none;
	line-height: 1.7;
	padding: 8px 16px;
	border-radius: 0 0 10px 10px;
}

.post-box {
	width: 100%;
	margin: 0 0 80px 0;
}
.post-meta {
	font-size: 14px;
	margin: 0 0 8px 0;
}

.post-thumbnail img {
	width: 100%;
}

.post-thumbnail-small {
	width: 100%;
	text-align: center;
}

.post-thumbnail-small img {
	width: 50%;
	margin: 0 auto;
	text-align: center;
}

.pagination {
	margin: 32px 0;
	text-align: center;
}
.pagination h2 {
	display: none;
}
.pagination a {
	padding: 5px 10px;
	display: inline-block;
	border: 1px solid #cccccc;
	background: #ffffff;
	font-size: 16px;
	text-decoration: none;
}
.pagination a:hover {
	background: #e8e8e8;
}
.pagination span {
	padding: 5px 10px;
	display: inline-block;
}
.pagination span.current {
}
.pagination {
	overflow: hidden;
	margin-top: 40px;
	margin-bottom: 20px;
	text-align: center;
	clear: both;
	background-color:	transparent;
}

#post-navi {
	box-sizing: border-box;
	width: 100%;
	margin: 32px 0;
	text-align: center;
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	align-items: stretch;
	justify-content: space-between;
	gap: 2px;
}
#post-navi .box {
	width: 49%;
	height: auto;
	border: 1px solid #383838;
}
#post-navi .box a {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 8px 8px;
	display: block;
}

.related-list {
	width: 100%;
	margin: 30px 0px 36px;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	flex-grow: 1;
	gap: 16px;
}
.related-list .list {
	width: 30%;
	height: auto;
	flex-direction: column;
}
.related-list .list img {
	width: 100%;
	height: 200px;
	box-shadow: 2px 2px 4px #aaa;
	object-fit: cover;
}
.related-list .list .title {
	margin: 0 0 8px;
	text-align: center;
}
.related-list .list:hover {
	opacity: 0.6;
	background: #eee;
	border-radius: 10px;
}
@media only screen and (max-width: 480px) {
	.related-list {
		flex-direction: column;
		gap: 32px;
	}
	.related-list .list{
		width: 96%;
	}
}

.list-msg {
	margin: 0 auto;
}
.list-msg li {
	box-sizing: border-box;
	font-size: 20px;
	margin: 16px 0;
	padding-left: 20px;
}
.chk-lst {
	padding-left: 8px;
}
.chk-lst li {
	box-sizing: border-box;
	font-size: 20px;
	position: relative;
	margin: 16px 0;
	padding-left: 20px;
}
.chk-lst li:before {
	content: '';
	position: absolute;
	width: 15px;
	height: 5px;
	margin-left: -24px;
	display: inline;
	top: 5px;
	border-left: 3px solid #f00;
	border-bottom: 3px solid #f00;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.icon-lst {
	padding-left: 8px;
}
.icon-lst li {
	box-sizing: border-box;
	font-size: 20px;
	position: relative;
	margin: 16px 0;
	padding-left: 20px;
}
.icon-lst li:before {
	content: '';
	display: inline;
	position: absolute;
	width: 25px;
	height: 25px;
	margin-left: -30px;
	top: -1px;
	background: url(https://artbuilt.jp/wp-content/themes/artbuild/images/troubled_face.png) no-repeat;
}
.post-lineup h1 {
	padding-left: 32px;
}
.post-lineup h2 {
	margin-top: 32px;
	line-height: 1.3;
}
.post-lineup h3 {
	margin-top: 32px;
	padding-left: 0;
	line-height: 1.3;
	border: none;
}
.mark {
	font-size: 32px;
}
.post-lineup .image-r, .post-lineup .image-r3 {
	margin-bottom: 60px;
}
@media only screen and (max-width: 480px) {
	/*.post-lineup .image-r, .post-lineup .image-r3 {*/
	.image-l3,
	.image-r, .image-r3 {
		width: 100%;
		height: auto;
		margin-bottom: 8px;
	}
}
.spec-list {
	width: 100%;
	display: flex;
	flex-direction: row;
}
.spec-box, .spec-box2, .spec-box3, .spec-box4 {
	box-sizing: border-box;
	height: auto;
	vertical-align: top;
	text-align: center;
	display: inline-block;
	position: relative;
}
.spec-box {
	width: 43%;
	margin: 0 3% 32px 3%;
	display: inline-block;
}
.spec-box2, .spec-box3 {
	width: 80%;
	margin: 0 auto 40px auto;
	display: block;
}
.spec-box4 {
	width: 65%;
	margin: 0 auto 40px;
}
@media only screen and (max-width: 480px) {
	.spec-box, .spec-box2, .spec-box3, .spec-box4 {width: 98%;}
}

.spec-box img, .spec-box2 .spec-photo img {
	width: 40%;
}
.spec-box .spec-logo img, .spec-box2 .spec-logo img {
	width: 60%;
}
.spec-box2 .spec-photo2 img {
	width: 70%;
}
.spec-box3 .spec-photo img {
	height: 100%;
}
.spec-box4 img {
	width: 40%;
	text-align: center;
}
.spec-box .name, .spec-box2 .name, .spec-box3 .name {
	width: 100%;
	font-weight: 500;
	position: relative;
	display: block;
}
.spec-box3 .name {
	padding-top: 30px;
}
.spec-box4 .name {
	margin: 0 auto;
	text-align: center;
}
.spec-box4 p {
	text-align: left;
}
.spec-box .name .size, .spec-box2 .name .size,
.spec-box3 .name .size, .spec-box4 .name .size {
	font-size: 14px;
}
.spec-box table, .spec-box2 table, .spec-box4 table {
	border: none;
}
.spec-box2 table {
	margin: 0 auto;
	width: 80%;
}
.spec-box3 table {
	margin: 0 auto;
	width: 100%;
}
.spec-box4 table {
	margin: 8px auto 12px;
	width: 100%;
}
.spec-box td, .spec-box th, .spec-box2 td, .spec-box2 th, .spec-box3 td, .spec-box3 th {
	border: none;
	border-bottom: 1px dashed #000;
	padding: 4px 0;
}
.spec-box th, .spec-box2 th {
	width: 50%;
	text-align: left;
	padding-left: 8px;
}
.spec-box3 th {
	width: 35%;
	text-align: left;
	padding-left: 8px;
}
.spec-box td, .spec-box2 td {
	width: 50%;
	text-align: right;
}
.spec-box3 td {
	width: 65%;
	text-align: right;
}
.spec-box4 th, .spec-box4 td {
	width: 50%;
	padding: 4px 8px;
	text-align: left;
	border: none;
}
.spec-box4 td {
	text-align: right;
}
/*
@media only screen and (max-width: 480px) {
	.spec-box4 th, .spec-box4 td { font-size: 14px; border: 1px solid #f00;}
}
*/
.spec-box .price, .spec-box2 .price, .spec-box3 .price {
	font-size: 20px;
	color: red;
}
.spec-box .discount {
	position: absolute;
	width: 100%;
	display: block;
	text-align: left;
	left: -16px;
	bottom: 30px;
}
.spec-box2 .discount {
	position: absolute;
	width: 36px;
	display: block;
	text-align: left;
	left: 4%;
	bottom: 15px;
}
.spec-box .discount img, .spec-box2 .discount img {
	width: 36px;
}
.spec-box2 .name .logo, .spec-box3 .name .logo {
	width: 80px;
	position: absolute;
	display: block;
	right: -10px;
	top: -20px;
}
.spec-box2 .name .logo img, .spec-box3 .name .logo img {
	width: 100%;
}
@media only screen and (max-width: 480px) {
	.spec-box2 .discount {left: 0;}
}
@media only screen and (max-width: 320px) {
	.spec-box2 .name .logo, .spec-box3 .name .logo {width: 50px;}
}
.lineup-logo {
	width: 100%;
	display: block;
	text-align: right;
	float: right;
}
.lineup-logo img {
	width: 80px;
}



.uniform, .uniform5 {
	box-sizing: border-box;
	text-align: center;
	margin: 0;
	padding: 0 8px;
}
.uniform td {
	width: 40%;
	padding-bottom: 4px;
	border: none;
}
.uniform3 td {
	width: 30%;
	padding: 4px;
	border: none;
}
.uniform .key1 img {
	max-width: 150px;
	max-height: 210px;
}
.uniform .key2 img {
	max-width: 240px;
	max-height: 200px;
}
.uniform .key3 img {
	width: 40%;
}
.uniform .cell_h {
	width: 50%;
	vertical-align: top;
	text-align: left;
}
.cell_half {
	width: 70%;
}
.uniform5 table {
	width: 100%;
	padding: 0;
	margin: 0;
	text-align: left;
}
.uniform5 td {
	vertical-align: top;
	width: 18%;
	margin: 0;
	padding: 0 16px;
	border: none;
}
.uniform5 .item0 {
	width: 20%;
}
.smile {
	text-align: center;
}
.smile h1 {
	margin: 0;
	padding-left: 46px;
	background: url(https://artbuilt.jp/wp-content/themes/artbuild/images/smile.png) no-repeat 0 48%;
	background-size: 44px 44px;
	display: inline-block;
}
.news-list ul {
	list-style: none;
	font-size: 15px;
}
.news-list li {
	margin: 12px 0;
}
.news-list .date {
	margin: 0 16px 2px 0;
	float: left;
}
.news-list .title {
	margin: 0 16px 2px 0;
}

details {
	margin: 0 0 18px;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: 0 1px 2px #666;
}
summary {
	font-size: 18px;
	font-weight: bold;
	cursor: pointer;
}
details p {
	margin: 12px 0;
}
details[open] {
	background: #fafafa;
}

.forms {
	width: 95%;
	padding: 0px;
	font-size: 16px;
}
.forms li {
	margin: 16px 0px 0px 16px;
	padding: 0;
	list-style: none
}
.forms label {
	width: 100%;
	margin-top: 32px;
	display: block;
}
.forms input[type=text] {
	box-sizing: border-box;
	padding: 8px;
	width: 100%;
	font-size: 100%;
	border: 1px solid #ededed;
	background: #fdfdfd;
	border-radius: 5px 5px 5px 5px;
	box-shadow: inset 1px 2px 6px -3px rgba(0,0,0,0.5);
}
.forms select {
	box-sizing: border-box;
	width: 100%;
	height: 26px;
	margin: 4px 0;
	padding: 8px 0;
	border: 1px #fff;
}
.forms textarea {
	box-sizing: border-box;
	width:				100%;
	font-size:			100%;
	padding:			8px;
	padding:			0;
	border: 			1px solid #ededed;
	background-color:	#fdfdfd;
	border-radius:		5px 5px 5px 5px;
	box-shadow:			inset 1px 2px 6px -3px rgba(0,0,0,0.5);
}
.forms .forms-respond input[type=submit]{
	font-size: 100%;
	padding: 8px;
	width: 100px;
	margin: 20px 5px 20px 32px;
	color: #666;
	box-shadow: 1px 1px 2px #383838;
	border: 1px solid #ffeeaa;
	border-radius: 10px;
	background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
	cursor: pointer;
}
.forms .forms-respond input:hover {
	color: red;
}
.forms .forms-check label {
	margin: 16px 0 16px 32px;
	padding: 0 0 0 32px;
	font-size: 110%;
	line-height: 24px;
	display: inline-block;
	cursor: pointer;
	position: relative;
}
.forms .forms-check label:before {
	content: '';
	width: 24px;
	height: 24px;
	display: inline-block;
	position: absolute;
	left: 0;
	background: #fff;
	box-shadow: inset 1px 2px 3px 0px #000;
	border-radius: 6px 6px 6px 6px;
}
.forms .forms-check input[type=checkbox] {
	display: none;
}
.forms .forms-check input[type=checkbox]:checked + label:before {
	content: '\2713';
	font-size: 24px;
	color: #fff;
	background: #06f;
}
.forms .required {
	padding: 1px 2px;
	color: #fff;
	background: #e00;
}
.forms .any {
	padding: 1px 2px;
	color: #fff;
	background: #07f;
}
.contact-error {
	margin-top: 6px;
	margin-left: 40px;
	color: #f00;
	clear: both;
}

#page-top {
	width: 64px;
	height: 64px;
	right: 12px;
	bottom: 40px;
	border: 1px solid rgba(0,0,0,0.4);
	box-shadow: 1px 1px 1px #ccc;
	border-radius: 50%;
	background: rgba(0,0,0,0.4);
	display: none;
	position: fixed;
	z-index: 100;
}
#page-top:after, #page-top:hover:after {
	content: "";
	width: 20px;
	height: 20px;
	top: 25px;
	left: 18px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	position: absolute;
}
#page-top:after {
	border-top: 8px solid #fff;
	border-right: 8px solid #fff;
}
#page-top:hover:after {
	border-top: 8px solid #f00;
	border-right: 8px solid #f00;
}

.error-404 {
	font-size: 120%;
	margin: 32px;
}
#map {
	width: 90%;
	height: auto;
	margin: 0 auto;
	text-align: center;
}
#map iframe {
	width: 100% !important;
}
.go-to-page {
	width: 100%;
	margin: 16px auto;
	text-align: center;
}
.go-to-page a:hover {
	text-decoration: underline;
	color: red;
}
/*
.btn {
	box-sizing: border-box;
//	width: 100%;
	text-align: center;
	position: relative;
	display: inline-block;
	top: -2px;
	margin: 24px auto 8px auto;
 	padding: 10px 20px;
	color: #666;
/	box-shadow: 1px 1px 2px #555;
//	border-radius: 8px;
//	background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
}
.btn:hover {
//	box-shadow: 0 1px #555;
	top: 1px;
}
*/


/*
.balloon, .balloon-top, .balloon-bottom {
	position: relative;
	width: 80%;
	height: 60px;
	margin: 0 auto 32px auto;
	border: 1px solid #fff;
	border-radius: 10px 10px 10px 10px;
	background: #fff2ac;
}
.balloon:after, .balloon-top:after {
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	top: 60px;
	left: 32px;
	border: 32px solid transparent;
	border-top: 32px solid #fff2ac;
}
.balloon:before, .balloon-bottom:before  {
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	top: 0px;
	left: 48px;
	border: 16px solid transparent;
	border-top: 16px solid #fff;
	overflow: hidden;
}

.balloon .text, .balloon-top .text, .balloon-bottom .text {
	font-size: 20px;
	letter-spacing: 16px;
	padding: 14px 8px 14px 40px;
	color: #383838;
}
@media only screen and (max-width: 480px) {
	.balloon .text, .balloon-top .text, .balloon-bottom .text {letter-spacing: normal;}
}
@media only screen and (max-width: 320px) {
	.balloon .text, .balloon-top .text, .balloon-bottom .text {font-size: 18px;}
}
*/

.sitemap {
}
.sitemap li {
	margin: 0 20px;
	padding: 4px 0;
}
.sitemap li a {
	color: #383838;
}
.sitemap li a:hover {
	text-decoration: underline;
}


#menu-side li {
	text-align: center;
	padding: 8px;
	border:1px solid #383838;
	background: #ffeeaa;
	background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
}
#menu-side li a {
	width: 100%;
	text-decoration: none;
	#color: #383838;
}
#menu-side li:hover {
	opacity: 0.6;
	text-decoration: none;
	background: #ffff00;
	background: linear-gradient(to bottom, #ffffff, #ffff00);
}

#footer {
	box-sizing: border-box;
	margin: 0 0;
	padding: 32px 16px 0;
	background: #f1d052;
	clear: both;
	display: block;
	position: relative;
}

#footer p {
	font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, sans-serif;
}
#footer #info {
	width: 100%;
	display: flex;
	flex-direction: row;
}
#footer #info p {
	font-size: 18px;
}
#footer #info .box {
	box-sizing: border-box;
	width: 50%;
	padding: 16px 8px 16px 16px;
}
#footer #info .box #cname {
	font-size: 20px;
	font-weight: bold;
	margin: 0 0 16px;
}
.footer-map {
	width: 100%;
	height: auto;
	margin: 0 auto;
	text-align: center;
}
.footer-map iframe {
	width: 100% !important;
}
@media only screen and (max-width: 480px) {
	#footer #info {
		flex-direction: column;
	}
	#footer #info .box {
		width: 100%;
		padding: 16px 8px;
	}
}
#footer-navi {

}
#menu-footer {
	font-size: 14px;
	padding: 0;
	margin: 16px 0 0 0;
	text-align: center;
	list-style:none;
}
#menu-footer li {
	box-sizing: border-box;
	margin: 8px 0;
	padding: 0 8px;
	text-align: center;
	display:inline-block;
	border-right: 1px solid #383838;
}
#menu-footer li:last-child {
	border: none;
}

#menu-footer li a {
	text-decoration: none;
	color: #383838;
}
#menu-footer li a:hover {
	text-decoration: underline;
	color: #f00;
}
.bg-black {
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 16px;
	padding: 8px 8px 1px;
	color: #fff;
	border-radius: 10px;
	background: #000;
}
.bg-green {
	border: 1px solid #197339;
	border-radius: 8px;
	background: #197339;
}
.bg-orange {
	border: 1px solid #E68126;
	border-radius: 8px;
	background: #E68126;
}
#footer h2 {
	font-size: 24px;
	color: #383838;
}
#footer-contact {
	box-sizing: border-box;
	width: 100%;
	font-size: 24px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}
#footer-contact .btn {
	width: calc(100% / 3) - 16px;
	padding: 8px 16px;
	border-radius: 10px;
	color: #fff;
}
#footer-contact .btn:hover {
	box-shadow: 2px 2px 1px #383838;
}
#footer-contact .title1,
#footer-contact .title2,
#footer-contact .title3 {
	color: #fff;
}
#footer-contact .title1:before {
	position: relative;
	top: 0px;
	margin: 0 3px 0 0;
	content: url("https://artbuilt.jp/wp-content/themes/artbuild/images/tel1.png");
}
#footer-contact .title2:before {
	position: relative;
	top: 3px;
	margin: 0 8px 0 0;
	content: url("https://artbuilt.jp/wp-content/themes/artbuild/images/line.png");
}
#footer-contact .title3:before {
	position: relative;
	top: 5px;
	margin: 0 0px 0 0;
	content: url("https://artbuilt.jp/wp-content/themes/artbuild/images/mail.png");
}
@media only screen and (max-width: 480px) {
	#footer-contact {
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
	}
	#footer-contact .btn {
		width: 80%;
	}
}
.contact-text {
	box-sizing: border-box;
	width: 100%;
	padding: 16px 15% 24px;
	text-align: center;
}
.contact-text .text {
	text-align: left;
	display: inline-block;
}
@media only screen and (max-width: 480px) {
	.contact-text {
		padding: 16px 16px 24px;
	}
}
/*
.contact-box {
	box-sizing: border-box;
	font-family: sans-serif;
	width: 100%;
	padding: 38px 8px;
	text-align:	 center;
	display: block;
}
.contact-mail {
	box-sizing: border-box;
	width: 100%;
	font-size: 26px;
	margin: 16px 0 8px 0px;
	padding: 8px 0 8px 26px;
	box-shadow: 1px 1px 2px #555;
	border-radius: 10px;
	background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
}
.mail-text {
	padding-left: 36px;
	text-align: center;
	background: url(https://artbuilt.jp/wp-content/themes/artbuild/images/email.png) no-repeat 0 50%;
	background-size: 30px 30px;
	display: inline-block;
}
.mail-btn {
	box-sizing: border-box;
	text-align: center;
	display: inline-block;
	margin: 0;
	padding: 12px 16px 12px 48px;
	color: #666;
	box-shadow: 1px 1px 2px #555;
	border-radius: 10px;
	background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
}
.mail-btn:hover {
	color: red;
	box-shadow: 0 1px #555;
}
.contact-tel {
	box-sizing: border-box;
	width: 100%;
	font-size: 26px;
	margin: 0;
	padding: 8px 0 4px 26px;
	line-height: 1.2;
	display:block;
}
.tel-text {
	padding-left: 30px;
	text-align: center;
	background: url(https://artbuilt.jp/wp-content/themes/artbuild/images/tel.png) no-repeat 0 48%;
	background-size: 24px 24px;
	display: inline-block;
}
.contact-tel a:hover, .contact-mail a:hover {
	color: red;
	opacity: 0.6;
}
.tel-pc {
	display: block;
}
.tel-sp {
	display: none;
}
.tel-msg {
	font-size: 14px;
	padding: 0;
}
@media only screen and (max-width: 480px) {
	.tel-pc { display: none;}
	.tel-sp {
		display: block;
		box-shadow: 1px 1px 2px #555;
		border-radius: 10px;
		background: linear-gradient(to bottom, #ffeeaa 28%, #ffcc77 100%);
	}
	.tel-msg {font-size: 12px;}
}
/*
.contact-text {
	font-family: serif;
	font-size: 120%;
	margin: 8px auto;
}
.contact-text2 {
	font-family: serif;
	text-align: left;
	margin: 24px 0;
}
*/
#copyright {
	width: 100%;
	font-size: 14px;
	margin: 0;
	padding: 24px 0 56px;
	text-align: center;
	color: #383838;
	clear: both;
	display: block;
}
.fn {
	color: 383838;
}
#footer {
	position: relative;
}
#footer-float-contact {
	box-sizing: border-box;
	width: 100%;
	height: 50px;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: row;
	justify-content: center;
	background: #fff;
	z-index: 10;
}
#footer-float-contact .fbtn {
	font-size: 14px;
	margin: 8px 4px 4px;
	text-align: center;
	border-radius: 10px;
}
#footer-float-contact .fbtn a {
	padding: 8px 24px;
	text-align: center;
	color: #fff;
	display: inline-block;
	border-radius: 10px;
}
#footer-float-contact .fbtn a:hover {
	box-shadow: 2px 2px 1px #aaa;
}
@media only screen and (max-width: 480px) {
	#footer-float-contact .fbtn a {
		padding: 8px 8px;
	}
}