@charset "utf-8";

/* fontファイル読み込み
---------------------------------------------------------------------------*/
@font-face {
    font-family:'Oswald';
    src: url(/fonts/Oswald-Regular.ttf);
}
@font-face {
    font-family:'MochiyPopOne';
    src: url(/fonts/MochiyPopOne-Regular.ttf);
}


/*lightbox url指定変更
---------------------------------------------------------------------------*/
.lb-close {
	z-index: 9999;
}
.lb-image {
	width: auto;
	height: auto;
	max-width: 100%;
	display: block;
}
/*slick.cssの読み込み
---------------------------------------------------------------------------*/
@import url("https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css");
* {
	padding: 0;
	margin: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html {
  height: 100%;
  scroll-padding-top: 100px;
}

body {
	color: #111;
	background-color: #F2F6F7;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	word-wrap: break-word;
	height: 100%;
	line-height: 2.2;
}

.font_mincho {
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

section,
article {
	display: block;
}

img {
	vertical-align: top;
}

a img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}

a:hover img {
	filter: brightness(120%);
}

li {
	list-style-type: none;
}

a {
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
a:hover {
	text-decoration: none;
}

table {
	border-collapse: collapse;
}
table td {
	border-collapse: collapse;
}

.clfix:after{
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}

br.br_sm{
	display:none;
}
/*
ヘッダー
-------------------------------------------*/
#header {
	width: 100%;
	position: fixed;
	z-index: 300;
	transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}
/*
#header h1 a img {
	display: block;
	position: absolute;
}*/

.pankuzu {
	background-color: #15394A;
	font-size: 14px;
	line-height: 30px;
	color: #EEE;
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
}

.pankuzu ul {
	width: 96%;
	max-width: 1100px;
	margin-right: auto;
	margin-left: auto;
}
.pankuzu li {
	display: inline-block;
}

.pankuzu li a {
	text-decoration: none;
	color: #DDD;
}

.pankuzu li a::after {
	content: ">";
	padding-left: 10px;
	padding-right: 10px;
}

.pankuzu li a:hover {
	color: #FFF;
}

.pankuzu li i {
	padding-right: 5px;
}


/*
メインコンテンツ
-------------------------------------------*/
.content {
	width: 100%;
	background-color: #F2F6F7;
	color: #111;
	padding-top: 10px;
	padding-bottom: 50px;
}
.content .cont_wrap {
	max-width: 1200px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
.content .cont_wrap .target_area1 .title{
	margin-right:10px;
}
.content .cont_wrap .target_area2 .text{
	margin-left:60px;
}
.content .cont_wrap .age_area .title{
	margin-right:10px;
}
.content .cont_wrap .content_inner{
	display:block;
	margin-bottom:80px;
}
/*list*/
.content .cont_wrap .content_inner ul.list{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
}
.content .cont_wrap .content_inner ul.list li{
	display:block;
	width:30%;
	margin:1% 1% 3% 1%;
}
.content .cont_wrap .content_inner ul.list li .list_inner{
	display:block;
	width:100%;
}
.content .cont_wrap .content_inner ul.list li .list_inner .img_area{
	display:block;
	width:100%;
}
.content .cont_wrap .content_inner ul.list li .list_inner .img_area img{
	display:block;
	width:100%;
}
.content .cont_wrap .content_inner ul.list li .list_inner .text_area{
	display:block;
	width:100%;
	text-align:center;
	background-color:white;
}
.content .cont_wrap .content_inner ul.list li .list_inner .text_area p{
	margin:0;
}
/**/
.content .cont_wrap .content_inner .content_list{
	display:flex;
	justify-content:center;
}
.content .cont_wrap .content_inner .content_list .item{
	display:block;
	width:40%;
	background-color:white;
	margin:0 3%;
	padding:20px 30px;
}
.content .cont_wrap .content_inner .content_list .item .img_area{
	display:block;
	width:100%;
}
.content .cont_wrap .content_inner .content_list .item .img_area .img_inner{
	display:block;
	width:100%;
}
.content .cont_wrap .content_inner .content_list .item .img_area .img_inner img{
	display:block;
	width:100%;
}
.content .cont_wrap .content_inner .content_list .item .text_area .text_inner{
	display:block;
	width:100%;
}
.content .cont_wrap .content_inner .content_list .item .text_area .text_inner h4{
	display:block;
	margin-left:0;
}
.content .cont_wrap .content_inner .content_list .item .text_area .text_inner .software{
	display:flex;
	padding:10px;
}
.content .cont_wrap .content_inner .content_list .item .text_area .text_inner .software .head{
	display:block;
}
.content .cont_wrap .content_inner .content_list .item .text_area .text_inner p.text{
	display:block;
	margin:0;
	padding:0;
}
.content .cont_wrap .content_inner span.icon_area{
	display:inline-block;
	width:fit-content;
	position:relative;
	padding-left:2em;
}
.content .cont_wrap .content_inner span.icon_area span.icon_inner{
	display:inline-block;
	width:1.5em;
	height:1.5em;
	overflow:hidden;
	position:absolute;
	top:50%;
	left:0;
	translate:0 -50%;
}
.content .cont_wrap .content_inner span.icon_area span.icon_inner img{
	display:block;
	width:100%;
	height:100%;
	object-fit:contain;
}
.content .cont_wrap .content_inner .mail_area{
	display:block;
	width:100%;
}
.content .cont_wrap .content_inner .mail_area a.mail_btn{
	display:block;
	width:fit-content;
	font-size:1.5rem;
	color:white;
	background-color:#15394A;
	border:2px solid #15394A;
	border-radius:50px;
	padding:0.2em 2em;
	margin:0 auto;
	text-decoration: none;
	position:relative;
	cursor:pointer;
	z-index:1;
}
.content .cont_wrap .content_inner .mail_area a.mail_btn:hover{
	color:#15394A;
	background-color:white;
}
.content .cont_wrap .content_inner .mail_area a.mail_btn::after{
	content:"";
	display:block;
	width:15px;
	height:15px;
	background-image:url(/img/chevron-right-solid-white.svg);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
	position:absolute;
	top:50%;
	right:0.5em;
	transform: translate(0, -50%);
	z-index:2;
}
.content .cont_wrap .content_inner .mail_area a.mail_btn:hover::after{
	background-image:url(/img/chevron-right-solid-darkblue.svg);
}
#sub_top {
	/*background-image: url(../img/sample_009.jpg);
	background-repeat: no-repeat;
	background-position: top;
	background-attachment: fixed;*/
	height: 100px;
	line-height: 30px;
	padding-top: 10px;
	width: 100%;
	background-size: 100%;
	text-align: center;
	font-weight: bold;
	color: #FFF;
	font-size: 34px;
	letter-spacing: 0.1em;
	-moz-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	-webkit-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	-ms-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
}

/*-------------------------------------------
Mainvisual
-------------------------------------------*/
#sec_mainvisual{
	position:relative;
}
#mainvisual {
	height: 720px;
	position: relative;
	margin-bottom: 120px;
}
#mainvisual .fade li {
	width: 75%;
	position: absolute;
	top: 0;
	right: 0;
	opacity: 0;
	animation: fade 30s infinite;
}
#mainvisual .fade li:nth-child(1) {
	animation-delay: 0s;
}
#mainvisual .fade li:nth-child(2) {
	animation-delay: 10s;
}
#mainvisual .fade li:nth-child(3) {
	animation-delay: 20s;
}
#mainvisual .fade li img {
	width: 100%;
	height: 720px;
	object-fit: cover;
}
#mainvisual .fade li::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.fade li img{
	border-radius: 10vw 0 0 10vw;
}
@keyframes fade {
	0% {
	  opacity: 0;
	}
	15% {
	  opacity: 1;
	}
	30% {
	  opacity: 1;
	}
	45% {
	  opacity: 0;
	}
	100% {
	  opacity: 0;
	}
}
/*メインキャラクター*/
#character_area{
	width:100%;
	height:40%;
	position:absolute;
	bottom:0;
	left:0;
	right:0;
}
#character_area .move_area{
	display:block;
	width:100%;
	height:100%;
	position:relative;
}
#character_area .move_area .move_inside_area{
	display:block;
	width:200px;
	height:auto;
	position:absolute;
	left:25vh;
	bottom:18vh;
	animation: floating-x 2.0s ease-in-out reverse;
}
@keyframes floating-x {
	0% {
		opacity:1;
		transform: translateX(0%);
	}
	100% {
		opacity:0;
		transform: translateX(100%);
	}
}
#character_area .move_area .move_inside_area .nekogirl1_img{
	display:block;
	width:100%;
	height:100%;
	object-fit:contain;
	filter: drop-shadow(1px 1px 2px black);
}
#character_area .move_area .move_inside_area .speech_frame_area{
	display:none;/*最初は非表示*/
	width:220px;
	height:auto;
	position:absolute;
	top:0;
	left:0;
	transform:translate(-75%, -40%);
}
#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area{
	position:relative;
}
#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .speech_frame{
	width:100%;
	height:100%;
	object-fit:cover;
}
#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .speech_text_area{
	display:flex;
	width:100%;
	height:100%;
	position:absolute;
	top:5%;
	left:5%;
	padding:8px 30px 50px 10px;
	align-items:center;
	justify-content:center;
}
#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .speech_text_area .speech_text1{
	font-family:'MochiyPopOne';
	font-size:1rem;
	font-weight:normal;
	line-height:1.2rem;
}
#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .play_btn_area{
	position:absolute;
	left:3%;
	top:3%;
}
#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .play_btn_area .play_btn{
	display:block;
	width:30px;
	object-fit:contain;
	cursor: pointer;
}
/*メインビジュアル下部バナーエリア*/
#sec_banner_area .banner_area{
	display:none;
	width:100%;
	text-align:center;
	justify-content:center;
	margin-bottom:50px;
}
#sec_banner_area .banner_area .leatherwork_banner{
	display:inline-block;
	cursor:pointer;
	margin-right:50px;
	position:relative;
	z-index:2;
}
#sec_banner_area .banner_area .leatherwork_banner img{
	width:100%;
	height:100%;
	object-fit:cover;
	box-shadow:1px 1px 2px 1px rgb(0,0,0,0.7);
}
#sec_banner_area .banner_area .calendar_banner{
	display:inline-block;
	cursor:pointer;
	position:relative;
	z-index:2;
}
#sec_banner_area .banner_area .calendar_banner img{
	width:100%;
	height:100%;
	object-fit:cover;
	box-shadow:1px 1px 2px 1px rgb(0,0,0,0.7);
}

.content h2 {
	font-size: 28px;
	line-height: 2.2;
	margin-bottom: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #15394A;
	font-weight: normal;
	letter-spacing: 1px;
	color: #111;
	text-align: center;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
	padding-top: 30px;
	padding-right: 10px;
	padding-bottom: 30px;
	padding-left: 10px;
	clear: both;
}

.content h2 i {
	padding: 10px;
	color: #71F0BD;
}

.content h2 span {
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	font-size: 24px;
	color: #42CBE3;
	font-weight: bold;
	letter-spacing: 0.1em;
}

.content h2 span.small {
	font-size: 18px;
	font-weight: normal;
	color: #555;
}

.content h3 {
	font-size: 24px;
	line-height: 30px;
	margin-bottom: 30px;
	position: relative;
	margin-top: 30px;
	padding-top: 15px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 44px;
	font-weight: normal;
	color: #2E94AD;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
	clear: both;
	letter-spacing: 0.05em;
}

.content h3::after {
	display: block;
	width: 3px;
	height: 20px;
	position: absolute;
	top: 50%;
	left: 20px;
	translate:0 -50%;
	background-color: #82CCD5;
	content: '';
}

.content h3 span {
	font-size: 15px;
	color: #555;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	padding-left: 15px;
}
.content h4 {
	font-size: 20px;
	color: #597E84;
	/*border-bottom-width: 1px;*/
	/*border-bottom-style: dotted;*/
	/*border-bottom-color: #ADC4C7;*/
	letter-spacing: 0.1em;
	padding: 10px;
	font-weight: bold;
	clear: both;
	margin-top: 20px;
	margin-right: 30px;
	margin-bottom: 0px;
	margin-left: 30px;
}

.content p {
	font-size: 16px;
	padding: 10px;
	margin-bottom: 30px;
	margin-top: 20px;
	margin-right: 30px;
	margin-left: 30px;
}
.content ul.content_list{
	display:list-item;
	margin-left:5%;
}
.content ul.content_list li{
	display:list-item;
	list-style:disc;
	padding-left:1em;
}
.content .ul_news li {
	font-size: 16px;
}
.content .ul_news li a span.date {
	padding-right: 20px;
	color: #888;
}

.content .ul_news li span.i_con {
	display: inline-block;
	padding-left: 5px;
	padding-right: 5px;
	background-color: #F90;
	color: #FFF;
	margin-right: 5px;
}
.content .ul_news li span.i_con.cl2 {
	background-color: #36BEAD;
}
.content .ul_news li span.i_con.cl3 {
	background-color: #F28C8C;
}
.content .ul_news li a {
	display: block;
	color: #333;
	line-height: 30px;
	padding: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
	text-decoration: none;
}

.content .ul_news li a:hover {
	color: #000;
	background-color: #FFF;
}

.img_center {
	display: block;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.img_center span {
	position: absolute;
	background-color: #333;
	background-color: rgba(0,0,0,0.8);
	color: #FFF;
	letter-spacing: 0.1em;
	padding: 10px;
	left: 0;
	top: 0;
}

.img_center div {
	position: absolute;
	background-color: #333;
	background-color: rgba(0,0,0,0.8);
	color: #FFF;
	letter-spacing: 0.1em;
	padding: 50px;
	right: 0;
	bottom: 0;
}

.img_left {
	float: left;
	padding-top: 20px;
	padding-right: 50px;
	padding-left: 30px;
	padding-bottom: 20px;
	max-width: 50%;
}
.img_right {
	float: right;
	padding-top: 20px;
	padding-right: 30px;
	padding-left: 50px;
	padding-bottom: 20px;
	max-width: 50%;
	text-align: center;
}

.img_left img,
.img_right img,
.img_center img {
	width: 70%;
}

.content .cont_wrap .img_right img{
	width:100%;
}

.content .img_left p,
.content .img_right p {
	font-size: 14px;
	margin: 0px;
	text-align: center;
	letter-spacing: 0.1em;
	color: #455E65;
}

.content p.check {
	color: #FF3333;
}
.content p.p_st {
	font-size: 20px;
	color: #CA28B1;
}

.content .cont_wrap .txt_box {
	background-color: #E6EDEE;
	padding: 20px;
	margin: 20px;
}
.content .cont_wrap .txt_box h3 {
	margin-top: 0px;
	margin-bottom: 0px;
	text-align: center;
	padding-right: 0px;
	padding-left: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #B6CACD;
	border-radius: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	color: #333;
}
.content .cont_wrap .txt_box h3::after {
	display: none;
}

a.ap {
	padding-top: 50px;
	margin-top: -50px;
}

/*
コンテンツ大ボタン
-------------------------------------------*/
.btn_cnt a {
	font-size: 16px;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	display: block;
	width: 240px;
	background-color: #a0dd11;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
	line-height: 22px;
	padding-top: 10px;
	padding-bottom: 10px;
	clear: both;
	font-weight: bold;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
.btn_cnt a i {
	padding-right: 10px;
}
.btn_cnt a:hover {
	color: #a2f157;
	background-color: #FFF;
}

.btn_cnt.rt a {
	float: right;
	max-width: 220px;
	margin-right: 10px;
}


/*
トップへ戻るボタン
-------------------------------------------*/
.to_top {
	position: fixed;
	bottom: 0px;
	right: 0px;
	z-index: 800;
}
.to_top a {
	text-decoration: none;
	text-align: center;
	display: block;
	width: 60px;
	height: 60px;
	background-color: #DCE7E9;
	color: #333;
	text-align: center;
	font-size: 32px;
	line-height: 60px
}
.to_top a:hover {
	background-color: #1BD;
	color: #FFF;
}

/*
フッター
-------------------------------------------*/

footer {
	background-color: #DCE7E9;
	color: #345;
	clear: both;
	width: 100%;
	display: block;
	padding-top: 20px;
	border-bottom-width: 20px;
	border-bottom-style: solid;
	border-bottom-color: #D2E1E3;
}

footer .cont_wrap {
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

footer .cont_wrap .f_box {
	width: 20%;
	padding: 10px;
}

footer .cont_wrap .f_box.lg {
	width: 60%;
}
footer .cont_wrap .f_box.lg.contact {
	display:none;
}
footer .cont_wrap p {
	font-size: 13px;
}

footer .cont_wrap ul {
	padding: 20px;
}

footer .cont_wrap ul li a {
	display: block;
	text-decoration: none;
	font-size: 13px;
	color: #555;
}

footer .cont_wrap ul li.contact a {
	text-align: center;
	color: #FFF;
	background-color: #1BD;
	font-size: 14px;
	padding: 2px;
	margin-top: 5px;
}

footer .cont_wrap ul li.contact a:hover {
	color: #1BD;
}
footer .cont_wrap ul li.contact a::before {
	display: none;
}

footer .cont_wrap ul li a::before {
	content: "・ ";
	color: #999;
}
footer .cont_wrap .f_box.lg.contact ul li a::before {
	content: "";
}

footer .cont_wrap ul li a:hover {
	color: #111;
	background-color: #FFF;
}

address {
	clear: both;
	font-size: 12px;
	font-style: normal;
	padding: 20px;
	text-align: center;
	letter-spacing: 1px;
}

footer .box_pr {
	clear: both;
	width: 100%;
	display: block;
	text-align: center;
	font-size: 10px;
	color: #55838A;
	letter-spacing: 1px;
	background-color: #D2E1E3;
	padding-top: 18px;
	line-height: 22px;
}

.box_pr ul li {
	display: inline;
	padding: 5px;
}

.box_pr ul li a {
	color: #55838A;
}


/*
各種テーブル
-------------------------------------------*/
.content table.table_01 {
	width: 96%;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
}
.content table.table_01 th,
.content table.table_01 td {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #888;
	padding: 20px;
}
.content table.table_01 th {
	font-size: 16px;
	white-space: nowrap;
	font-weight: normal;
	letter-spacing: 1px;
	width: 33%;
}
.content table.table_01 td {
	font-size: 14px;
	line-height: 30px;
	background-color: #FFF;
}

.small {
	font-size: smaller;
	color: #666;
}
.chui {
	color: #F03600;
}

.table_01 caption {
	font-size: 14px;
	line-height: 30px;
	background-color: #E5E5E5;
	color: #111;
	letter-spacing: 1px;
	padding-top: 5px;
	padding-bottom: 5px;
	border: 1px solid #FFF;
	box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
}
.table_01 th span {
	font-size: 12px;
	color: #CCC;
}


/*
トップ下部ピックアップ
-------------------------------------------*/
.pick_up {
	width: 100%;
}

.pick_up ul {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 1400px;
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.pick_up ul li {
	width: 32%;
	position: relative;
}
.pick_up ul li a {
	display: block;
	overflow: hidden;
	position: relative;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
.pick_up ul li a img {
	width: auto;
	max-width: 100%;
	z-index: 0;
}
.pick_up ul li a:hover img {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}

.pick_up ul li a::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.2);
	z-index: 5;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}

.pick_up ul li a div {
	color: #FFF;	
	font-size: 50px;
	line-height: 1;
	text-decoration: none;
	text-align: center;
	display: block;
	width: 80%;
	margin-top: -20px;
	margin-left: -40%;
	position: absolute;
	left: 50%;
	top: 47%;
	font-weight: bold;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
	z-index: 10;
}
.pick_up ul li a div span {
	font-size: 16px;
	letter-spacing: 2px;
}


/*
コンテンツボックス
-------------------------------------------*/
.box_cont {
	width: 100%;
	max-width: 1200px;
	margin: auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	padding-top: 20px;
	padding-right: 20px;
	padding-left: 20px;
}

.box_cont .box_c_in {
	width: 48%;
	min-height: 200px;
	padding: 10px;
	border: 1px solid #CFDEE0;
	margin-bottom: 30px;
}

.box_cont .box_c_in:hover {
	background-color: #FFF;
	border-top-color: #1BD;
	border-right-color: #1BD;
	border-bottom-color: #1BD;
	border-left-color: #1BD;
}

.box_cont .box_c_in img {
	max-width: 100%;
	padding: 20px;
}

.content .box_cont .box_c_in h2 {
	padding-bottom: 10px;
	font-size: 24px;
	border-bottom-width: 1px;
	border-bottom-color: #CCC;
	padding-top: 10px;
}

/*
背景入り帯
-------------------------------------------*/
.obi_002 {
	width: 100%;
	height: auto;
	background-image: url(../img/obi_002.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0 0 50%;
	position: relative;
}

.obi_002 .box_in {
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-flow: column;
	flex-flow: column;
	position: absolute;
	color: #FFF;
	background-color: rgba(54,190,173,0.8);
}

.obi_002 h2 {
	font-size: 36px;
}
.obi_002 p {
	line-height: 2;
	font-weight: bold;
}

/*
無限ループ
-------------------------------------------*/
.loop_wrap_base {
	width: 100%;
	height: auto;
	overflow: hidden;
	background-color: #F2F6F7;
	padding-top: 30px;
	padding-bottom: 30px;
}


.loop_wrap_base h2 {
	font-weight: normal;
	color: #111;
	text-align: center;
	line-height: 1.2;
	padding: 10px;
	font-size: 24px;
}
.loop_wrap_base h2 span {
	letter-spacing: 0.2em;
	font-size: 14px;
	color: #555;
}

.loop_wrap {
  display: flex;
  width: 220%;
  height: auto;
}

.loop_wrap ul {
  width: 100%;
  height: auto;
  display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.loop_wrap ul li {
	width: 20%;
}

.loop_wrap ul li a {
	display: block;
	text-decoration: none;
	color: #555;
	text-align: center;
	line-height: 1.6;
	font-size: 14px;
	position: relative;
}
.loop_wrap ul li a img {
	width: 100%;
	display: block;
	margin-bottom: 5px;
}

.loop_wrap ul li a span {
	display: inline-block;
	background-color: #36BEAD;
	color: #FFF;
	font-size: 12px;
	position: absolute;
	top: 0;
	left: 0;
	padding: 5px;
	letter-spacing: 1px;
	z-index: 10;
}

.loop_wrap ul li a span.cl_2 {
	background-color: #333;
}

.loop_wrap ul li a span.cl_3 {
	background-color: #FF9900;
}

@keyframes loop {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

@keyframes loop2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}

.loop_wrap ul:first-child {
  animation: loop 50s -25s linear infinite;
}

.loop_wrap ul:last-child {
  animation: loop2 50s linear infinite;
}

.loop_wrap:hover ul {
  animation-play-state: paused;
}



/*
SNSボタン
-------------------------------------------*/

.h_sns {
	padding: 5px;
	position: fixed;
	top: 130px;
	right: 0px;
	background-color: #88ce59cc;
	border-radius: 8px 0px 0px 8px;
	-webkit-border-radius: 8px 0px 0px 8px;
	-moz-border-radius: 8px 0px 0px 8px;
}
.h_sns li a {
	display: block;
	padding: 10px;
	color: #FFF;
	line-height: 30px;
	width: 50px;
	text-align: center;
	text-decoration: none;
	font-size: 18px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.h_sns li a:hover {
	background-color: #FFF;
	color: #1BD;
}


/*
エフェクト
-------------------------------------------*/
.effect {
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
	transform: translateY(20px);
	-webkit-transform: translateY(20px);  
    -moz-transform: translateY(20px); 
	-webkit-transition: 1.0s ease-out;
	-moz-transition: 1.0s ease-out;
	transition: 1.0s ease-out;
}
.effect.d_02 {
	transition-delay:0.2s;
	-webkit-transition-delay:0.2s;
}
.effect.d_04 {
	transition-delay:0.4s;
	-webkit-transition-delay:0.4s;
}
.effect.d_06 {
	transition-delay:0.6s;
	-webkit-transition-delay:0.6s;
}
.effect.d_08 {
	transition-delay:0.8s;
	-webkit-transition-delay:0.8s;
}
.effect.start {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	transform: translateY(0px);
	-webkit-transform: translateY(0px);  
    -moz-transform: translateY(0px);    
}


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

 
.obi_002 .box_in p a.tel {
	font-size: 30px;
	color: #FFF;
	text-decoration: none;
	line-height: 1.2;
}
.obi_002 .box_in p a.tel strong {
	padding-left: 10px;
	font-size: 150%;
}



.content .box_att {
	margin-top: 30px;
}

.content .box_att h2 {
	font-weight: normal;
	font-size: 24px;
	color: #bd823e;
	padding: 15px;
	border-bottom-color: #db8ed7;
}
.content .box_att p {
	font-size: 14px;
	margin: 0px;
	color: #dcdf5e;
}


/*
FAQ
-------------------------------------------*/
dl.faq {
	display: block;
	margin: auto;
	width: 90%;
}

dl.faq dt {
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size: 20px;
	color: #FFF;
	background-color: #e9be62;
	display: block;
	position: relative;
	width: 80%;
	/*margin-left: 20%;*/
	/*margin-bottom: 40px;*/
	margin:0 auto 40px auto;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 50px;
}

dl.faq dt::before{
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	font-size: 24px;
	content: "Q.";
	position: absolute;
	left: 20px;
	top: 13px;
}
/*
dl.faq dt::after{
    border: solid transparent;
    content:'';
    height:0;
    width:0;
    pointer-events:none;
    position:absolute;
    border-color: rgba(39, 132, 152, 0);
    border-top-width:16px;
    border-bottom-width:16px;
    border-left-width:8px;
    border-right-width:8px;
    border-bottom-color:#509827;
    bottom:100%;
    right:30px;
}*/
dl.faq dd {
	font-size: 16px;
	background-color: #FFF;
	display: block;
	position: relative;
	width: 80%;
	padding: 20px;
	/*margin-bottom: 100px;*/
	margin:0 auto 100px auto;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 50px;
}
dl.faq dd::after{
	border: solid transparent;
	content: '';
	height: 0;
	width: 0;
	pointer-events: none;
	position: absolute;
	border-color: rgba(255,255,255,0.0);
	border-top-width: 16px;
	border-bottom-width: 16px;
	border-left-width: 8px;
	border-right-width: 8px;
	border-bottom-color: #FFFFFF;
	bottom: 100%;
	left: 30px;
}

dl.faq dd::before{
	font-size: 24px;
	content: "A.";
	position: absolute;
	left: 20px;
	top: 13px;
}


/*
事例一覧＆ギャラリー
-------------------------------------------*/
.works_list{
	display:flex;
	flex-wrap:wrap;
}
.works_list li {
	display: block;
	width: 25%;
	padding: 20px;
}

.works_list li a {
	display: block;
	text-decoration: none;
	width: 100%;
	padding: 10px;
	border: 1px solid #F2F6F7;
	position: relative;
}

.works_list li a:hover {
	background-color: #FFF;
	border: 1px solid #DDE7EA;
}

.works_list li a span {
	display: block;
	color: #FFF;
	font-size: 12px;
	background-color: #36BEAD;
	position: absolute;
	top: 5px;
	left: 5px;
	z-index: 10;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
}

.works_list li a span.cl_2 {
	background-color: #333333;
}

.works_list li a span.cl_3 {
	background-color: #FF9900;
}

.works_list li a img {
	width: 100%;
	height: 180px;
	object-fit: cover;
}

.works_list li a p {
	color: #111;
	text-align: center;
	margin: 0px;
}
.g_list li {
	display: block;
	float: left;
	width: 20%;
	padding: 20px;
}

.g_list li a {
	display: block;
	width: 100%;
	height: 150px;
	overflow: hidden;
}

.g_list li a img {
	width: 100%;
	height: 150px;
	object-fit: cover;
}

.g_list li a img:hover {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}


/*
news
-------------------------------------------*/

.content .cont_wrap .box_left {
	width: 100%;
	float: center;
	padding: 10px;
}

/*
ページャー
-------------------------------------------*/
.pager {
	padding-top: 50px;
	padding-bottom: 50px;
	clear: both;
}

.pager .pagination {
  text-align: center;
}

.pager .pagination li {
	display: inline;
	margin: 0 2px;
	padding: 0;
	display: inline-block;
	width: 36px;
	height: 36px;
	text-align: center;
	position: relative;
}


.pager .pagination li a{
	vertical-align: middle;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	display: table;
	color: #FFF;
	text-decoration: none;
	background-color: #333333;
}

.pager .pagination li a span{
  display:table-cell;
  vertical-align:middle;
}

.pager .pagination li a:hover,
.pager .pagination li a.active{
	color: #000;
	background-color: #F9F9F9;
}


/*kazari*/
@keyframes kazari {  
	  
	0% {
		border-radius: 61% 39% 65% 35% / 57% 62% 38% 43%;
		transform: scale(1) rotate(0deg);	/*scaleは大きさ。rotateは回転。*/
	}
	50% {
		border-radius: 41% 59% 38% 62% / 62% 41% 59% 38%;
		transform: scale(1.3) rotate(180deg);	/*scaleは大きさ。1.3倍。rotateは回転。180度。*/
	}
	100% {
		border-radius: 61% 39% 65% 35% / 57% 62% 38% 43%;
		transform: scale(1) rotate(360deg);	/*scaleは大きさ。rotateは回転。360度。*/
	}

}

/*kazari1*/
.kazari1 {
	animation: kazari 15s linear infinite;	/*15s(秒)がアニメーションにかける秒数*/
	width: 40vw;height: 40vw;				/*幅と高さ。vwは画面幅に対して。100vwが幅100%です。*/
	position: absolute;z-index: -1;
	top: 18vh;left: -10vw;	/*配置場所の指定。上から、左から。*/
	background: #FFEDB3;	/*背景色*/
	opacity: 0.5;			/*透明度。色が50%出た状態。*/
}

/*kazari2*/
.kazari2 {
	animation: kazari 150s linear reverse infinite;	/*150s(秒)がアニメーションにかける秒数*/
	width: 22vw;height: 22vw;				/*幅と高さ。vwは画面幅に対して。100vwが幅100%です。*/
	position: absolute;z-index: -2;
	top: -1vh;left: 20vw;	/*配置場所の指定。上から、左から。*/
	background: #e1d0c3 url('../images/bg1.svg') center center / 100px;	/*背景色、和柄パターンの読み込み。100pxはパターンの大きさ。。*/
	opacity: 0.2;			/*透明度。色が50%出た状態。*/
}

/*画像を囲むブロック*/
#mainvisual .mainimg-slick {
	width: 70vw;	/*スライドショーの幅。画面の70%。*/
	height: auto;
}

.mainimg-slick div {
	border-radius: 10vw 0 0 10vw;
}
/*-------------------------------------------
characor
-------------------------------------------*/

#characor {
	background: url("../img/bg.gif") repeat;
	animation: fall 10s infinite linear;
	padding: 10px 0;
	margin-bottom: 60px;
}
/*
アニメーション処理
10秒かけて背景画像の位置「background-position」を移動させる動作を繰り返す
--------------------------------------------------------------------*/
@keyframes fall {
	0% {
  		background-position: 0 0;
	}
	100% {
	 	background-position: -700px 700px;
	}
}
#characor .menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#characor .menu li {
	width: 48%;
	border: 1px solid #21c712;
	border-radius: 20px;
	padding: 5px;
	margin-bottom: 22px;
}
/* 3つ目以降はmargin-bottomを設定しない */
#characor .menu li:nth-child(n + 3) {
	margin-bottom: 0;
}
#characor .menu-title {
	font-weight: bold;
	line-height: 1;
	text-align: center;
}
#characor .menu-title .ja {
	display: block;
	font-size: 1.75rem;
	margin-bottom: 15px;
}
#characor .menu-title .en {
	display: block;
	font-size: 1.125rem;
	margin-bottom: 10px;
}

  
/*フッター共通
---------------------------------------------------------------------------*/
#footer-contents, #footermenu {
	padding: 2rem var(--space-small) 2rem var(--space-large);
}

/*フッターのコンテンツ（マップが入っているブロック）
---------------------------------------------------------------------------*/


/*footer-contents内のマップ。
---------------------------------------------------------------------------*/
.iframe-box {
	width: 100%;
	height: 0;
	padding-top: 36.25%;	
	position: relative;
	overflow: hidden;
}
.iframe-box iframe {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}
/*お問い合わせ
---------------------------------------------------------------------------*/
.ifr_area{
	display:block;
	width:100%;
	margin:0 auto;
}
.ifr_area iframe{
	display:block;
	width:100%;
	margin:0 auto;
}
.contact_comment{
	text-align:center;
}
form {
	width: 70%;
	margin: 0 auto;
	text-align: center;
}
.form-row {
	display: flex;
	align-items: center;
	padding: 20px;
	border-bottom: 1px solid #f2f4f5;
}
.form-row:last-child {
	border-bottom: none;
	justify-content:center;
}
.form-row:last-child .form-label{
	display:none;
}

.form-label {
	display: flex;
	align-items: center;
	width: 250px;
}
.form-label label {
	font-weight: bold;
}
.form-label span {
	margin-left: 10px;
	padding: 2px 6px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	background-color: #166ab5;
}

.cofirm_area h2{
	text-align:center;
}
.cofirm_area .comment{
	text-align:left;
} 
.cofirm_area table{
	text-align:left;
	margin:0 auto 100px auto;
}
.cofirm_area table tr{
	display:block;
	margin-bottom:10px;
}
.cofirm_area table th{
	width:250px;
}
.cofirm_area form .submit_btn{
	color:white;
	font-size:1rem;
	font-weight:normal;
	background-color:#166ab5;
	padding:15px 45px;
	margin-right:30px;
	cursor:pointer;
}
.cofirm_area form .return_btn{
	font-size:1rem;
	font-weight:normal;
	color:black;
	background-color:white;
	border:1px solid black;
	padding:15px 45px;
}
.send_area{
	text-align:center;
	margin:0 auto;
}
.send_area .text_area{
	margin-bottom:200px;
}
.send_area .return_btn{
	color:white;
	font-size:1rem;
	font-weight:normal;
	background-color:#166ab5;
	border-radius:5px;
	padding:15px 45px;
	margin-top:300px;
	margin-right:30px;
	text-decoration-line:none;
}
/*ログイン画面*/
.user_area form{
	display:flex;
	flex-direction:column;
	justify-content:center;
	margin:0 auto;
	align-items:center;
	margin-bottom:200px;
}
.user_area form input.login_user_id{
	width:70%;
	margin-bottom:30px;
}
.user_area form input.login_user_password{
	width:70%;
	margin-bottom:30px;
}
.user_area form button.login_submit{
	display:block;
	width:200px;
}
/*利用者専用画面*/
.userfield_area .userfield_name_area{
	text-align:center;
}
.userfield_area .userfield_name_area .userfield_name{
	display:block;
	width:auto;
	height:auto;
	text-align:right;
	color:black;
	border:1px solid black;
	background-color:white;
}
.userfield_area .userfield_name_area .userfield_name p{
	margin:0;
}
.userfield_area .category_area{
	margin-top:50px;
	margin-bottom:100px;
}
.userfield_area .category_area ul{
	display:flex;
	justify-content:center;
}
.userfield_area .category_area ul li{
	margin-right:40px;
}
.userfield_area .category_area ul li:last-child{
	margin-right:0;
}
.userfield_area .category_area ul li a{
	display:inline-block;
	width:100%;
	color:white;
	font-weight:bold;
	text-align:center;
	text-decoration:none;
	background-color:#36BEAD;
	border-radius:5px;
	padding:10px 30px;
}
.userfield_area .rule_area .rule_item{
	margin-bottom:100px;
}

/* フォームパーツのデザイン */
input, textarea {
	background-color: #ffffff;
	border: none;
	border-radius: 3px;
	padding: 15px 20px;
	font-size: 16px;
	color: #333;
	flex-grow: 1;
}
input::placeholder,
textarea::placeholder {
	color: #999;
	font-size: 14px;
}
select {
	background-color: #ffffff;
	border: none;
	border-radius: 3px;
	padding: 15px 20px;
	font-size: 16px;
	color: #333;
}
button {
	text-align: center;
	cursor: pointer;
	margin-top: 30px;
	padding: 15px 45px;
	border: none;
	border-radius: 3px;
	color: #fff;
	font-weight: bold;
	background-color: #166ab5;
}

.jyunbi {
	text-align: center;
}

/*
#header h1 a img {
	left: 50%;
	margin-left: -590px;
}*/
#header #g_navi {
	right:0;
	/*margin-right: -590px;*/
}


body {
	font-size: 16px;
}
/*
ヘッダー
-------------------------------------------*/
#header {
	display:flex;
	width:100%;
	height: 100px;
	align-items:center;
	background-color:rgba(255,255,255,0.7);
}
#header h1{
	display:block;
	width:180px;
	height:auto;
	margin-left:10px;
}
#header h1 a{
	display:block;
	width:100%;
}
#header h1 a img {
	display:block;
	width:100%;
}
.menu_btn,
.btn_close {
	display: none;
}
/*
PCグローバルナビ
-------------------------------------------*/
#g_navi {
	position: absolute;
	right: 10px;
	/*top: 25px;*/
	width: auto;
	margin-left: 100px;
	/*display: block !important;*/
	display:flex;
	justify-content:space-between;
	z-index: 1000;
}
#g_navi .logo_area{
	display:none;
}
#g_navi ul.navi_menu li{
	display: inline;
}
#g_navi ul.navi_menu li a {
	width: auto;
	padding: 20px;
	line-height: 30px;
	display: block;
	color: #111;
	text-decoration: none;
	text-align: center;
	position: relative;
	float: left;
	letter-spacing: 1px;
	/*font-size: 16px;*/
	font-size:min(1.0vw, 20px);
	font-weight: bold;
}
#g_navi ul.navi_menu li a::before {
	display: block;
	height: 2px;
	position: absolute;
	top: 2px;
	width: 70%;
	left: 15%;
	background-color: rgba(17,187,221,0);
	content: '';
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
#g_navi ul.navi_menu li a:hover::before {
	background-color: rgb(92, 221, 17);
	top:0px;
	width: 80%;
	left: 10%;
}
#g_navi ul.navi_menu li a:hover {
	color: rgb(133, 221, 17) !important;
}
/*pc*/
#g_navi .navi_contact1_pc{
	display:flex;
	align-items:center;
	/*margin-left:30px;*/
	padding:10px 10px 10px 25px;
	border-radius:10px;
	transition: 0.2s linear;
}
#g_navi .navi_contact1_pc .telno{
	display:block;
	font-size:min(1.5vw, 20px);
	font-weight:bold;
	line-height:1.8rem;
	color: #111;
	text-decoration:none;
	text-wrap:nowrap;
	position:relative;
}
#g_navi .navi_contact1_pc .telno span.number{
	display:block;
	padding-left:20px;
}
#g_navi .navi_contact1_pc .telno:before{
	content:"\f879";
	font-size:1rem;
	font-family: "Font Awesome 5 Free";
	position:absolute;
	top:0;
	left:0;
}
#g_navi .navi_contact1_pc .telno span.comment{
	display:block;
	font-size:0.9vw;
}
/*phone*/
#g_navi .navi_contact1_phone{
	display:none;
	align-items:center;
	/*margin-left:30px;*/
	padding:10px 10px 10px 25px;
	border-radius:10px;
	transition: 0.2s linear;
}
#g_navi .navi_contact1_phone:hover{
	background-color:#1BD;
}
#g_navi .navi_contact1_phone a.telno{
	display:block;
	width:100%;
	/*font-size:min(1.5vw, 20px);*/
	font-weight:bold;
	line-height:1.8rem;
	color: #111;
	text-decoration:none;
	text-wrap:nowrap;
	position:relative;
}
#g_navi .navi_contact1_phone:hover a.telno{
	color:white;
}
#g_navi .navi_contact1_phone a.telno:before{
	content:"\f879";
	font-size:1rem;
	font-family: "Font Awesome 5 Free";
	position:absolute;
	top:0;
	left:0;
	translate:40% 0;
}
#g_navi .navi_contact1_phone a.telno .comment{
	display:block;
	font-size:1rem;
}
#g_navi .navi_contact1_pc a.telno .comment{
	display:block;
	font-size:min(0.7vw, 15px);
}
#g_navi ul.navi_contact2{
	display:flex;
	width:300px;
	max-width:300px;
	align-items:center;
	text-align:center;
	margin-left:10px;
}
#g_navi ul.navi_contact2 li.request{
	display:flex;
	align-items:stretch;
	width:100%;
	height:100%;
	flex:1;
}
#g_navi ul.navi_contact2 li.request a{
	display:flex;
	width:100%;
	height:100%;
	background-color: rgb(219, 194, 95);
	font-size:min(1.2vw, 15px);
	font-weight:bold;
	color: white;
	/*text-shadow:1px 2px 3px black;*/
	/*padding-left: 20px;
	padding-right: 20px;*/
	padding-top:10px;
	padding-bottom:10px;
	line-height:1.5rem;
	margin-left: 10px;
	border-radius: 4px;
	border:3px solid rgb(219, 194, 95);
	text-decoration:none;
	justify-content:center;
	align-items:center;
	/*text-wrap:nowrap;*/
}
#g_navi ul.navi_contact2 li.request a:hover {
	background-color: #FFF;
	color: rgb(219, 194, 95);
}
/*
#g_navi ul.navi_contact2 li.request a .text{
	transform:translateY(50%);
}*/
#g_navi ul.navi_contact2 li.line{
	display:flex;
	align-items:stretch;
	width:100%;
	height:100%;
	flex:1;
}
#g_navi ul.navi_contact2 li.line a{
	display:flex;
	width:100%;
	height:100%;
	background-color: rgb(60, 212, 93);
	font-size:min(1.2vw, 15px);
	font-weight:bold;
	color: #FFF !important;
	/*padding-left: 20px;
	padding-right: 20px;*/
	padding-top:10px;
	padding-bottom:10px;
	line-height:1.5rem;
	margin-left: 10px;
	border-radius: 4px;
	border:3px solid rgb(60, 212, 93);
	/*-webkit-border-radius: 4px;
	-moz-border-radius: 4px;*/
	color: #111;
	text-decoration:none;
	text-wrap:nowrap;
	justify-content:center;
	align-items:center;
}
#g_navi ul.navi_contact2 li.line a:hover {
	background-color: #FFF;
	color: rgb(60, 212, 93) !important;
}
#g_navi ul.navi_contact2 li.line a .span2{
	display:block;
	font-size:8px;
}


/*
ヘッダー
------------------------------------------*/
#sub_top.contact {
	background-image: url(../img/sub_top_contact.jpg);
}
#sub_top.news {
	background-image: url(../img/sub_top_news.jpg);
}
#sub_top.concept {
	background-image: url(../img/sub_top_concept.jpg);
}
#sub_top.works {
	background-image: url(../img/sub_top_works.jpg);
}
#sub_top.about {
	background-image: url(../img/sub_top_about.jpg);
}
.no_pc {
	display: none !important;
}



/*
media
--------------------------------------------------*/
@media screen and (max-width:1366px) {
	#g_navi ul.navi_menu li a {
		padding:20px 5px;
		font-size:min(1.0vw, 14px);
	}
}
@media screen and (max-width:1160px){
	#g_navi ul.navi_menu li a {
		/*font-size:14px;*/
		font-size:min(0.9vw, 14px);
	}
	#g_navi ul.navi_contact2 li.telno {
		font-size:1.3rem;
	}

}
/*960px以下*/
@media screen and (max-width:960px){
	#g_navi .navi_contact1_pc{
		display:none;
	}
	#g_navi .navi_contact1_pc{
		justify-content:center;
		margin-left:0px;
		margin:0 50px;
	}
	#g_navi .navi_contact1_pc .telno{
		font-size:25px;
	}
	#g_navi .navi_contact1_pc .telno .comment{
		font-size:12px;
	}
	#g_navi .navi_contact1_phone{
		display:flex;
		text-align:center;
		justify-content:center;
		margin-left:0px;
		margin:0 50px;
	}
	#g_navi .navi_contact1_phone .telno{
		font-size:25px;
	}
	#g_navi .navi_contact1_phone .telno .comment{
		font-size:12px;
	}
	#footer-contents {
		display: flex;	/*flexボックスを使う指定*/
		gap: 2rem;		/*左右のボックスの間のマージン的な設定*/
	}
	#footer-contents .footermenu {
		width: 100%;			
	}
	body {
		font-size: 16px;
	}

	body.fixed {
		overflow: hidden;
	}

	img {
		max-width: 100% !important;
		height: auto;
		width /***/:auto;
		margin-left:auto;
		margin-right:auto;
	}

	br.br_sm{
		display:block;
	}
	.content h3::after {
		height: calc(100% - 30px);
	}
	.content h4 {
		margin-right: 10px;
		margin-left: 10px;
	}
	/*contact*/
	.contact_comment{
		text-align:left;
	}

	/*
	メニューボタン
	-------------------------------------------*/
	.menu_btn {
		display: block;
		/*height: 40px;
		width: 40px;*/
		height:50px;
		width:50px;
		text-align: center;
		padding-top: 5px;
		padding-bottom: 5px;
		position: fixed;
		z-index: 5000;
		top: 5px;
		right: 5px;
		border-radius: 3px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		cursor: pointer;
	}
	.menu_btn:hover {
		cursor: pointer;
	}

	.menu_btn span {
		/*width: 28px;*/
		width:38px;
		/*height: 2px;*/
		height:3px;
		display: block;
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -14px;
		background-color: #1BD;
	}
	.menu_btn span {
		transition: all 0.3s;
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);  
		-moz-transform: rotate(0deg);    
	}
	.menu_btn span.top {
		/*transform: translateY(-8px);
		-webkit-transform: translateY(-8px);  
		-moz-transform: translateY(-8px);*/
		transform: translateY(-10px);
		-webkit-transform: translateY(-10px);  
		-moz-transform: translateY(-10px);        
	}
	.menu_btn span.bottom {
		/*transform: translateY(8px);
		-webkit-transform: translateY(8px);  
		-moz-transform: translateY(8px);*/ 
		transform: translateY(10px);
		-webkit-transform: translateY(10px);  
		-moz-transform: translateY(10px);    
	}
	.menu_btn:hover span.top {
		transform: translateY(-10px);
		-webkit-transform: translateY(-10px);  
		-moz-transform: translateY(-10px);    
	}
	.menu_btn:hover span.bottom {
		transform: translateY(10px);
		-webkit-transform: translateY(10px);  
		-moz-transform: translateY(10px);    
	}

	.menu_btn.opened span {
		background-color: #7BC;
	}

	.menu_btn.opened span.middle {
		background: rgba(255, 255, 255, 0);
		transform: translateX(30px);
		-webkit-transform: translateX(30px);  
		-moz-transform: translateX(30px);    
	}
	.menu_btn.opened span.top {
		transform: rotate(-45deg) translateY(0px);
		-webkit-transform: rotate(-45deg) translateY(0px);  
		-moz-transform: rotate(-45deg) translateY(0px);    
	}
	.menu_btn.opened span.bottom {
		transform: rotate(45deg) translateY(0px);
		-webkit-transform: rotate(45deg) translateY(0px);  
		-moz-transform: rotate(45deg) translateY(0px);    
	}

	/*
	グローバルナビ
	-------------------------------------------*/
	#g_navi {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0px;
		overflow: auto;
		z-index: 3000;
		background-color: #F2F6F7;
		background-color: rgba(242,246,247,0.85);
		display: none;
		/*padding-left: 10%;*/
	}
	#g_navi .logo_area{
		display:block;
		padding-top:20px;
		padding-left:10%;
	}
	#g_navi .logo_area a img{
		width:100px;
	}
	#g_navi ul.navi_menu {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: column;
		flex-flow: column;
		-webkit-justify-content: center;
		justify-content: center;
		/*min-height: 100%;*/
		min-height: 50%;
		padding-left:10%;
	}
	#g_navi ul.navi_menu li a {
		color: #111;
		text-decoration: none;
		display: block;
		padding: 10px;
		line-height: 22px;
		font-size: 14px;
		font-weight: bold;
		letter-spacing: 1px;
	}
	#g_navi .navi_contact1{
		justify-content:center;
		margin-left:0px;
		margin:0 50px;
	}
	#g_navi .navi_contact1 .telno{
		font-size:25px;
	}
	#g_navi .navi_contact1 .telno .comment{
		font-size:12px;
	}
	#g_navi ul.navi_contact2{
		flex-direction:column;
		margin:0 auto;
		min-height:50%;
		padding:20px;
	}
	#g_navi ul.navi_contact2 li.request{
		width:100%;
		flex:none;
		margin-bottom:10px;
	}
	#g_navi ul.navi_contact2 li.request a{
		margin-left:0;
		font-size:15px;
	}
	#g_navi ul.navi_contact2 li.request a .text{
		transform:none;
	}
	#g_navi ul.navi_contact2 li.line{
		width:100%;
		flex:none;
	}
	#g_navi ul.navi_contact2 li.line a{
		margin-left:0;
		font-size:15px;
	}
	#g_navi ul.navi_contact2 li.line a .span2{
		font-size:12px;
	}
	/*
	メニューシャドウ
	-------------------------------------------*/
	.bg_bl {
		background-color: #FFF;
		height: 100%;
		width: 100%;
		opacity: 0.80;
		filter: alpha(opacity=80);
		-ms-filter: "alpha( opacity=80 )";
		display: block;
		position: fixed;
		z-index: 2000;
	}


	/*
	ヘッダー
	-------------------------------------------*/
	#header {
		/*height: 100%;*/
		height:10vh;
	}
	#header h1 a img {
		/*height: 36px;*/
		width:150px;
		margin-left:0;
	}
	#header .h_menu {
		display: none;
	}
	#header #info {
		display: none;
	}

	#sub_top.sample {
		background-image: url(../img/sub_top_sample_sp.jpg);
	}
	#sub_top.faq {
		background-image: url(../img/sub_top_faq_sp.jpg);
	}
	#sub_top.contact {
		background-image: url(../img/sub_top_contact_sp.jpg);
	}
	#sub_top.news {
		background-image: url(../img/sub_top_news_sp.jpg);
	}
	#sub_top.concept {
		background-image: url(../img/sub_top_concept_sp.jpg);
	}
	#sub_top.works {
		background-image: url(../img/sub_top_works_sp.jpg);
	}
	#sub_top.about {
		background-image: url(../img/sub_top_about_sp.jpg);
	}

	/*
	フッター
	-------------------------------------------*/
	footer {
		border-bottom-width: 60px;
	}

	footer .cont_wrap .f_box {
		width: 50%;
		text-align: left;
	}
	footer .cont_wrap .f_box.lg {
		width: 100%;
		text-align: center;
	}
	footer .cont_wrap .f_box.lg.contact {
		display:block;
	}
	footer .cont_wrap .f_box.lg.contact ul{
		display:flex;
		justify-content:space-between;
	}
	footer .cont_wrap .f_box.lg.contact ul li{
		width:49%;
	}
	footer .cont_wrap .f_box.lg.contact ul li.request a{
		width:100%;
		padding:10px 30px;
		color:white;
		background-color:rgb(219, 194, 95);
		border-radius:10px;
	}
	footer .cont_wrap .f_box.lg.contact ul li.line a{
		width:100%;
		padding:10px 30px;
		color:white;
		background-color:rgb(60, 212, 93);
		border-radius:10px;
	}

	.no_sp {
		display: none;
	}

	.content .cont_wrap .box_left {
		width: 100%;
		float: none;
	}
	.content .cont_wrap .box_right {
		width: 100%;
		float: none;
		overflow: hidden;
	}

	.content .cont_wrap .box_right .fb-page {
		width: 100% !important;
	}
	.content .cont_wrap .content_inner .content_list{
		flex-direction:column;
	}
	.content .cont_wrap .content_inner .content_list .item{
		width:100%;
		margin:0 0 30px 0;
	}
	.content .cont_wrap .content_inner .content_list .item .text_area .text_inner .software{
		flex-direction:column;
	}
	/**/
	.content .cont_wrap .content_inner ul.list::after{
		content:"";
		display: block;
		width:45%;
	}
	.content .cont_wrap .content_inner ul.list li{
		display:block;
		width:45%;
		margin:1% 1% 5% 1%;
	}
	/**/
	.content ul.content_list{
		margin-left:15%;
	}

	.works_list li {
		width: 33.33%;
	}

	.g_list li {
		width: 33.33%;
	}

}

/*767px以下*/
@media only screen and (max-width: 767px){
	.pager {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	.pager .pagination li{
		display: none;
	}

	.pager .pagination li.pre,
	.pager .pagination li.next{
		display: inline-block;
		width: 40%;
		height: 40px;
		text-align: center;
	}

	.pager .pagination li.pre a,
	.pager .pagination li.next a{
		width: 100%;
		text-align: center;
	}

	.pager .pagination li.pre span::after{
		content: "　前の10件へ";
	}

	.pager .pagination li.next span::before{
		content: "次の10件へ　";
	}
	
	.works_list li {
		width: 50%;
		padding: 10px;
	}

	.g_list li {
		width: 50%;
	}

	.img_center span {
		font-size: 14px;
		padding: 5px;
	}

	.img_center div {
		font-size: 12px;
		padding: 20px;
	}

	dl.faq {
		width: 96%;
	}

	dl.faq dt {
		font-size: 18px;
		width: 90%;
		/*margin-left: 10%;*/
	}

	dl.faq dd {
		width: 90%;
	}

}

/*700px以下*/
@media screen and (max-width:700px) {
	/*画像を囲むブロック*/
	.mainimg-slick {
		width: 80vw;	
	}
	/*ブロック全体*/
	#footer-contents, #footermenu {
		padding: 2rem var(--space-small) 2rem var(--space-small);
	}
}

/*640px以下*/
@media screen and (max-width:640px){
	.h_sns {
		width: 100%;
		display: -webkit-box;
		display: -moz-box;
		display: -webkit-flexbox;
		display: -moz-flexbox;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: -moz-flex;
		display: flex;
		-webkit-box-lines: multiple;
		-moz-box-lines: multiple;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		top: auto;
		bottom: 0;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		padding-right: 60px;
	}

	.h_sns li {
		width: 25%;
	}
	.h_sns li a {
		width: 100%;
		text-align: center;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
		
	#index_top #top_catch {
		top: 25%;
		left: 75%;
		width: 90%;
		height: 10%;
		margin-top: 0px;
		margin-left: 0px;
	}


	#index_top #top_catch h2 {
		font-size: 40px;
	}

	#index_top #top_catch p {
		font-size: 12px;
	}

	#sub_top {
		height: 180px;
		padding-top: 100px;
	}

	.content {
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.content p {
		margin-bottom: 20px;
		margin-top: 10px;
		margin-right: 10px;
		margin-left: 10px;
	}

	.img_left,
	.img_right {
		float: none;
		display: block;
		margin-left: auto;
		margin-right: auto;
		padding-left: 10px;
		padding-right: 10px;
		padding-bottom: 10px;
		max-width: 100%;
	}

	.pick_up ul li {
		width: 100%;
	}

	.content .ul_news li span.date {
		padding-right: 0px;
		display: block;
	}

	.obi_001 {
		background-image: url(../img/obi_001_sp.jpg);
		padding-left: 10px;
		padding-right: 10px;
	}

	.obi_001 p {
		text-align: left;
		margin-left: 15px;
		margin-right: 15px;
		font-size: 14px;
	}

	.obi_002 {
		background-image: url(../img/obi_002_sp.jpg);
		padding: 0 0 100%;
	}

	.loop_wrap {
	width: 400%;
	}

	.box_cont {
		padding-right: 10px;
		padding-left: 10px;
	}

	.box_cont .box_c_in {
		width: 100%;
		padding: 5px;
	}

	.content .cont_wrap .txt_box {
		margin-left: 0px;
		margin-right: 0px;
	}
}

/*460px以下*/
@media screen and (max-width:460px){
	/*lightbox*/
	.lb-image {
		width: 100% !important;
		height: auto !important;
		max-width: 100%;
	}

	#mainvisual{
		height:50vh;
		overflow:hidden;
	}
	#mainvisual .fade li {
		width: 100%;
		height:50vh;
	}
	#mainvisual .fade li img{
		width:100%;
		height:100%;
		object-fit:cover;
		object-position:50% 50%;
	}
	/*キャラクターエリア*/
	#character_area{
		top:78vh;
	}

	#character_area .move_area .move_inside_area{
		width:130px;
		left:60%;
		bottom:20%;
		animation: floating-x 2.0s ease-in-out reverse;
	}
	@keyframes floating-x {
		0% {
			opacity:1;
			transform: translateX(0%);
		}
		100% {
			opacity:0;
			transform: translateX(30%);
		}
	}
	#character_area .move_area .move_inside_area .speech_frame_area{
		width:150px;
	}
	#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .speech_text_area{
		display:flex;
		width:100%;
		height:100%;
		position:absolute;
		top:0%;
		left:0%;
		transform:translateY(-10%);
		padding:10px;
	}
	#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .speech_text_area .speech_text1{
		font-family:'MochiyPopOne';
		font-size:0.7rem;
		line-height:1rem;
	}
	#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .play_btn_area{
		position:absolute;
		left:0%;
		top:0%;
	}
	#character_area .move_area .move_inside_area .speech_frame_area .speech_frame_inside_area .play_btn_area .play_btn{
		display:block;
		width:24px;
		object-fit:contain;
		background-color:white;
		border-radius:50%;
		cursor: pointer;
	}
	/*メインビジュアル下部バナーエリア*/
	#sec_banner_area .banner_area{
		/*display:flex;*/
		flex-direction:column;
		margin-top:35vh;
		padding:5px 10px;
	}
	#sec_banner_area .banner_area .leatherwork_banner{
		margin-right:0px;
		margin-bottom:20px;
	}


	input,
	textarea {
		max-width: 300px !important;
	}

	.content table.table_01 th,
	.content table.table_01 td {
		width: 100% !important;
		display: block;
	}

	.content table.table_01 th {
		background-color: #F6F6F6;
	}


	#index_top #top_catch h2 {
		font-size: 30px;
	}

	#sub_top {
		font-size: 24px;
	}

	.content h2 {
		font-size: 24px;
	}

	.content .obi_001 h2 {
		font-size: 22px;
	}

	#characor .menu {
		flex-direction:column;
	}
	#characor .menu li{
		width:auto;
		margin-left:10px;
		margin-right:10px;
	}
	#characor .menu li:nth-child(n + 3) {
		margin-bottom: 22px;
	}
	form {
		width: 100%;
	}
	.form-row {
		flex-direction:column;
	}
	.form-label {
		width: 100%;
	}
	input{
		width:100%;
	}
	#select{
		width:100%;
		max-width:300px;
		text-align-last: center
	}
	#message{
		width:100%;
	}
	/*
	ご利用条件
	---------------------------*/
	.content .cont_wrap .target_area1 {
		margin-bottom:0;
	}
	.content .cont_wrap .target_area1 .title{
		display:block;
		margin-bottom:10px;
	}
	.content .cont_wrap .target_area2 {
		margin-top:0;
	}
	.content .cont_wrap .target_area2 .text{
		margin-left:0;
	}
	/*
	お問い合わせ - 確認画面
	---------------------------*/
	.cofirm_area table tbody tr{
		display:flex;
		flex-direction:column;

	}
	.cofirm_area table tbody tr td{
		margin-left:10px;
	}
	.cofirm_area form{
		display:flex;
		justify-content:center;
		width:100%;
		padding:0 10px;
	}
	.cofirm_area form .submit_btn{
		width:auto;
		padding:10px 20px;
		margin:5px;
		flex-grow:0;
	}
	.cofirm_area form .return_btn{
		width:auto;
		padding:10px 20px;
		white-space:nowrap;
		flex-grow:0;
		margin:5px;
	}
	/*
	お問い合わせ - 送信完了画面
	---------------------------*/
	.send_area .return_btn{
		margin-right:0;
	}
	/*ログイン画面*/
	.user_area form{
		margin-bottom:150px;
	}
	.user_area form input.user_formid{
		margin-bottom:30px;
	}
	.user_area form input.user_formpassword{
		margin-bottom:30px;
	}
	/*
	利用者専用画面
	---------------------------*/
	.userfield_area .category_area ul{
		flex-wrap:wrap;
	}
	.userfield_area .category_area ul li{
		width:43%;
		margin-bottom:10px;
	}
	.userfield_area .category_area ul li:nth-child(1){
		margin-right:40px;
	}
	.userfield_area .category_area ul li:nth-child(2){
		margin-right:0px;
	}
	.userfield_area .category_area ul li:nth-child(3){
		margin-right:40px;
	}
	.userfield_area .category_area ul li:nth-child(4){
		margin-right:0px;
	}
	.userfield_area .category_area ul li a{
		text-wrap:nowrap;
	}
}