@charset "utf-8";

/*
Theme Name: hondori-contact2025
Description:hondori-contact2025
Theme URI: 
Author: 2025-poool-k
Author URI: 
Version: 0.001
License: 
License URI: 
*/

/* 基本 */
body {margin: 0;padding: 0;background: #fff ;color: #232323;letter-spacing:0.05em;}
* {box-sizing: border-box;font-family: 'Noto-Regular', sans-serif;}

body {
	animation: fadeIn 2s ease 0s 1 normal;
	-webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}

/* base*/
/* 全体枠 */
.all{min-width:1000px;overflow: hidden;}

/* 全体横幅1000px */
.all-width{
	display: block !important;
	margin: 0 auto !important;
	width:1000px;min-width:1000px;
	text-align:center;
	padding:0 60px;
}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 1000px){
	/* 全体枠 */
.all{overflow: hidden;min-width:100%;}
.all-width{display: block;margin: 0 auto;width:92%;min-width:92%;padding:0;}
}
@media screen and (max-width: 600px){
	/*スマホ・PC振り分け*/
.pc{display: none !important;}
.sp {display: block !important;}
}
/*--------------------------------------------------------------------------------*/


/* Noto日本書体（Regular） */
@font-face {
	font-family: 'Noto-Regular';
	src: url('fonts/NotoSansCJKjp-Regular.ttf') format('truetype');
}
.Noto-Regular {font-family: 'Noto-Regular', sans-serif;}

/* Noto日本書体（Bold）*/
@font-face {
	font-family: 'Noto-Bold';
	src: url('fonts/NotoSansCJKjp-Bold.ttf') format('truetype');
}
.Noto-Bold {font-family: 'Noto-Bold', sans-serif;}

.weight100{font-weight:100;}
.weight300{font-weight:300;}
.weight400{font-weight:400;}
.weight500{font-weight:500;}
.weight600{font-weight:600;}
.weight700{font-weight:700;}
.weight900{font-weight:900;}

/* ひな明朝（明朝） */
@font-face {
	font-family: 'hinamin';
	src: url('fonts/HinaMincho-Regular.ttf') format('truetype');
}
.hinamin {font-family: 'hinamin', serif;}

/* 明朝体フォント */
.font_mincho {
	font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}
/* 太文字 */
.bold-font{font-weight: bold;}

/* 左寄せ */
.text-l{text-align: left;}
/* 中央寄せ */
.text-c{text-align: center;}
/* 右寄せ */
.text-r{text-align: right;}

/* テキスト色 */
.red{color: #e33 !important;}
.green{color: #5b0 !important;}
.blue{color: #37c !important;}
.blown{color: #a96 !important;}

a{text-decoration:none;color:#3198C0;}
.toppage a{text-decoration:none;color:#3198C0;}
a:hover{text-decoration:underline;}


/* 文字間つめ */
.letter-sp{ letter-spacing: -0.1em;}
/*取り消し線を引く*/
.deleted {text-decoration: line-through;}

/*文字にアンチエイリアスを効かせる*/
.font_smoothing {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/*hr*/
hr{display:block;height:1px;border:0;border-top:1px solid #E5E5E5;margin:1.5em 0;padding:0;overflow: hidden;background: none;}
/*点線*/
.tenline{
	border-top:1px dotted #aaaaaa;
	height:1px;
	margin: 30px 0;
}

/* image */
img {
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
}
/*リンク画像透明度*/
a img:hover {
	filter: alpha(opacity=75);
	-moz-opacity:0.75;
	opacity:0.75;
}

/*iframe*/
iframe {max-width: 100%;}
/*非表示*/
.none {display: none !important;}

/*スマホ・PC振り分け*/
.sp {display: none !important;}
/* クリア */
.both{clear: both;}
/* clearfix */
.clearfix::after {
	content: "";
	display: block;
	clear: both;
}

.sp-ss{margin-bottom:10px;}
.sp-s{padding-bottom:20px;}
.sp-m{margin-bottom:30px;}
.sp-l{margin-bottom:40px;}
.sp-ll{margin-bottom:50px;}

/*ページ上部へ*/
#page-top {
	position: fixed !important;
	bottom: 15px;right:15px;
	width:50px;
	height: auto;z-index: 50;
	text-align: center;
	line-height: 0;
	z-index: 200;
}
#page-top a {display: block;}

.tate {
	position: fixed !important;
	top: 250px;right:0;
	background-color:#dee8e9;
	width: ;
	height: auto;z-index: 50;
	text-align: center;
	line-height: 0;
	z-index: 200;
}
.tate a {display: block;padding: 15px;}
.tate:hover{filter: alpha(opacity=65);-moz-opacity:0.65;opacity:0.65;}
/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:480px){
#page-top img {width:30px;height:30px;}
.tate {display:none;}
}
/*--------------------------------------------------------------------------------*/


/*▼▼▼トップの設定▼▼▼*/
/*全体*/
#container{}

.toppage .maru-icon{display:inline-block;background:url(images/maru.png) no-repeat center left;background-size: 14px auto;padding:0 0 0 20px;}

.toppage .more{display:inline-block;margin-top:40px;border-radius: 12px;-webkit-border-radius: 12px;-moz-border-radius: 12px;background:#FAF4E9;font-size: 100%;min-width: 300px;line-height: 1;font-size: 90%;}
.toppage .more a{display:block;color:#3198C0;padding:18px 0px 18px 0 !important;}
.toppage .more a:hover{cursor: pointer;text-decoration: none;color: #fff;}
.toppage .more:hover{text-decoration:none;border-radius: 12px;-webkit-border-radius: 12px;-moz-border-radius: 12px;background:#3198C0;color: #fff !important;cursor: pointer;text-decoration: none;}

.toppage h3 {font-size:200%;font-weight:normal;margin-bottom:40px;font-family: 'Noto-Bold', sans-serif;line-height: 1.3;color:#66ACCC;letter-spacing:0.15em;}
.toppage h3 .en {color:#232323;font-size:35%;margin-top:5px;letter-spacing:0.2em;font-family: 'hinamin', serif;}

.toppage .more-02{font-size:85%;display:inline-block;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:768px){
	.toppage .more{margin-bottom: 10px !important;
	min-width: 260px !important;display:inline-block !important;
}
}
@media screen and (max-width:600px){
.toppage .more{letter-spacing: 0;}
.toppage .more a{padding:14px 0px 14px 0 !important;}

}

@media screen and (max-width:480px){
.toppage h3 {margin-bottom:20px;}
}

@media screen and (max-width:400px){
}
/*--------------------------------------------------------------------------------*/


/*ヘッダ */
header {width: 100%;text-align: center;overflow: hidden;position:relative ;background:transparent;}

/*ヘッダ メニュー */
.head-bg{width:100%;text-align:left;height: ;font-size:82%;position: relative;background:#f9f1e4;}

.head-bg .l-box{float:left;display: inline-block;vertical-align: top;line-height:1;padding:20px 0 0 20px;}
.head-bg .r-box{float:right;display: inline-block;vertical-align: top;text-align:right;padding:0;line-height:1;}

.head-bg ul{display:inline-block;vertical-align: middle;}
.head-bg ul li{display:inline-block;vertical-align: middle;}
.head-bg ul li a{display:block;}

.head-bg .r-box .g-navi{display:inline-block;vertical-align: top;}
.head-bg .r-box .g-navi .menu-ue{display:block;}
.head-bg .r-box .g-navi .menu-ue li{margin:15px 0;padding:0 15px;border-right:1px solid #3198C0;}

.head-bg .r-box .g-navi .menu-st{display:block;font-size:90%;margin:6px 15px;}
.head-bg .r-box .g-navi .menu-st li{background:transparent url(images/maru.png) no-repeat left center;background-size:10px;padding-left:15px;margin-left:15px;}

.head-bg .r-box .g-link{display:inline-block;vertical-align: top;font-size:90%;}
.head-bg .r-box .g-link a:hover{text-decoration:none;}

.head-bg .r-box .g-link .type-search{display:inline-block;vertical-align: middle;background-color: #3198C0;color: #dee8e9;}
.head-bg .r-box .g-link .type-search a{display:block;color: #dee8e9;padding: 15px;}

.head-bg .r-box .g-link .maker-search{display:inline-block;vertical-align: middle;background-color:#dee8e9;color: #3198C0;}
.head-bg .r-box .g-link .maker-search a{display:block;padding: 15px;}
.head-bg .r-box .g-link .type-search:hover,.head-bg .r-box .g-link .maker-search:hover{
	filter: alpha(opacity=65);
	-moz-opacity:0.65;
	opacity:0.65;
}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 1045px){
.head-bg .r-box .g-navi{display:none;}
}
@media screen and (max-width: 845px) {
.head-bg .r-box .g-link{display:none;}
}
/*--------------------------------------------------------------------------------*/

/*中面用タイトル */
.page .main-bg{
text-align:center;
background:#f9f1e4 url(images/c-main.png) no-repeat center top 100px;
background-size:300px auto;
height:320px;position:relative;min-height:320px;
position:relative;
}
/*中面用タイトルイラスト */
.page .main-bg .p-l-ill{position:absolute;bottom:-10px; left:80px;}
.page .main-bg .p-r-ill{position:absolute;bottom:-10px; right:80px;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 600px){
.page .main-bg .p-l-ill{width:150px !important;bottom:-10px; left:20px;}
.page .main-bg .p-r-ill{width:150px !important;bottom:-10px; right:20px;}
}
/*--------------------------------------------------------------------------------*/

/*メインタイトル */
.main-bg{text-align:center;background:#f9f1e4;height:100vh;position:relative;min-height:780px;z-index:0;}
.main-bg .all-width{
	border:1px solid #F9F1E4;
	height:95vh;width:100%;
	position:relative;padding:0 10%;
	z-index:0;
	background:url(images/c-main.png) no-repeat center top 120px;min-height:780px;
}
.main-bg .ill-box{background-color:#ddd;position:relative;}
.m-l-ill{position:absolute;top:70px; left:0;}
.m-r-ill{position:absolute;top:70px; right:0;}
.main-bg .main-title{width:100%;}
.main-bg .title-copy{margin:420px 0 0 0;}

.main-bg .btm-box{
	position:absolute; bottom:0;left:0;
	width:100%;
	height:194px;
	background-image: url(images/icons-l.png), url(images/icons-r.png), url(images/wave01.png);
	background-repeat: no-repeat;
	background-size: auto, auto, 100% 194px;
	background-position: left 60px bottom 50px, right 60px bottom 50px, center bottom;
}
.main-bg .topics-box{width:400px;text-align:left;
	position:absolute; bottom:150px;left:60px;
	background: linear-gradient(to right, #FFFFFF, #FDD0C9);
	font-size:65%;
	letter-spacing:0;
	display: inline-block;padding: 10px 16px 10px 10px;border-radius: 24px;-webkit-border-radius: 24px;-moz-border-radius: 24px;
}

.main-bg .topics-box .maru-icon{;padding:4px 6px 4px 14px;margin:4px 6px 4px 6px;display:inline-block;background:url(images/maru.png) no-repeat center left;background-size: 10px auto;border-right: 1px solid #222;}


/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 1000px){
}
@media screen and (max-width:900px){
	.main-bg .btm-box{
	background-size: 200px auto, 200px auto, 100% 100px;
	background-position: left 20px bottom 40px, right 20px bottom 40px, center bottom;
}
}

@media screen and (max-width:768px){
.m-l-ill{width: 200px;height: auto;top:60px; left:0;}
.m-r-ill{width:220px;height: auto;top:60px; right:0;}
}

@media screen and (max-width:600px){
	.main-bg .btm-box{
	background-size: 128px auto, 128px auto, 100% 100px;
	background-position: left 20px bottom 40px, right 20px bottom 40px, center bottom;
}

}
@media screen and (max-width:480px){
.main-bg{text-align:center;background:#f9f1e4;height:520px;position:relative;min-height:auto;}
.main-bg .title-copy{margin:220px 0 0 0;}
.main-bg .title-copy img{display:block !important;width:140px;margin:0 auto 30px auto !important;}
.main-bg .all-width{
	border:1px solid #F9F1E4;
	height:400px;
	position:relative;
	z-index:0;
	background:url(images/c-main.png) no-repeat center top 80px;
	background-size:300px;
}
.main-bg .btm-box{background-size: 128px auto, 128px auto, 100% 50px;height:128px;
background-position: left 20px bottom 0, right 20px bottom 0, center bottom;}

.main-bg .topics-box{
	width:94%;text-align:left;margin:0 3%;
	position:absolute; bottom:40px;left:0;
	font-size:68%;
padding: 3px 16px 3px 10px;}

.m-l-ill{width: 120px;height: auto;top:55px; left:0;}
.m-r-ill{width: 130px;height: auto;top:55px; right:0;}

}
/*--------------------------------------------------------------------------------*/


/*topics*/
#topics{background-color:#fff;padding:20px 0;position:relative;z-index:1;}
#topics img{width:22.5%;margin:0 0.8%;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 1000px){
#topics .all-width{width:92%;min-width:92%;}
}
@media screen and (max-width:768px){
}
@media screen and (max-width:600px){
#topics img{width:44%;margin:0 1.5% 15px 1.5%;}
}
@media screen and (max-width:480px){
#topics{background-color:#fff;padding:30px 0;}
}
/*--------------------------------------------------------------------------------*/


/*案内*/
#introduction{
	padding: 30px 0 10px 0;
	color: ;
	background:#fff;
	position:relative;
	color:#3198C0;
	line-height:2.5;
}

.link-box{margin:40px 0;}
.link-box .more{margin:0 28px;}

#introduction .notes{font-size:70%;margin: 20px 0 0 0;line-height:2.2;}
.underline{text-decoration:underline;}
#introduction .sp-br{display: none;}
/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#introduction .all-width{width:92%;min-width:92%;}
}
@media screen and (max-width:768px){
#introduction .sp-br{display: block;}
}
@media screen and (max-width:600px){
#introduction h3{width:300px;margin:0 auto 20px auto ;}
#introduction{font-size: 85%;line-height:2.2;}
#introduction .notes{font-size:85%;margin: 10px 0 0 0;line-height:2.2;}
#introduction .link-box .more{font-size:110%;}
}
@media screen and (max-width:480px){
}
/*--------------------------------------------------------------------------------*/


/*初めての方へ*/
#guide{
	background-image: url(images/icons-l.png), url(images/icons-r.png), url(images/wave02.png);
	background-repeat: no-repeat;
	background-size: auto, auto, 100% 194px;
	background-position: left 60px top 70px, right 60px top 70px, center top;
	background-color:#E3ECED;
	padding: 180px 0 60px 0;
	letter-spacing:0;
}

#guide h3{letter-spacing:0;margin-bottom:0;}
#guide h3 .h3-box{text-align: left;display:inline-block;background:url(images/c-mark.png) no-repeat left center;
	background-size:72px auto;padding:20px 0 20px 85px;
}
.hajimete{font-family: 'hinamin', serif !important;margin-bottom:8px;}
.miezurai{font-family: 'hinamin', serif !important;font-size:60%;text-decoration:underline}


#guide .box{display: inline-block;vertical-align: top;width:30%;margin:1.2%;background-color:#fff;border-radius: 10px;-webkit-border-radius: 10px;-moz-border-radius: 10px;}
#guide .box .titles{color:#3198C0;font-family: 'hinamin', serif !important;margin-top: 20px;padding-left: 20px;}
#guide .box .read{padding: 10px 20px 20px 20px;line-height: 1.8;text-align: left;font-size: 75%}


/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#guide .all-width{width:92%;min-width:92%;}
}

@media screen and (max-width:900px){
	#guide{
	background-size: 200px auto, 200px auto, 100% 100px;
	background-position: left 20px top 40px, right 20px top 40px, center top;
}
}

@media screen and (max-width:650px){
#guide .box{width:350px;margin:10px 0;}
}
@media screen and (max-width:600px){
	#guide{
	background-size: 128px auto, 128px auto, 100% 100px;
	background-position: left 20px top 40px, right 20px top 40px, center top;
	padding: 100px 0 30px 0;
}
}
@media screen and (max-width:480px){
	#guide{
	background-size: 128px auto, 128px auto, 100% 60px;
	background-position: left 20px top 20px, right 20px top 20px, center top;
}

#guide h3 .h3-box{text-align: left;display:inline-block;background:url(images/c-mark.png) no-repeat left center;
	background-size:60px auto;padding:20px 0 20px 70px;
}
.hajimete{font-family: 'hinamin', serif !important;margin-bottom:8px;font-size:90%;}
.miezurai{font-family: 'hinamin', serif !important;font-size:50%;text-decoration:underline}


}

@media screen and (max-width:380px){
#guide .box{width:90%;margin:10px 0;}
}

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


/*SEARCH*/
#search{padding:85px 0;border-top:1px solid #FAF4E9;border-bottom:1px solid #FAF4E9;}

#search ul{text-align:left;}

#search ul li{border:1px solid#E4E4E4;display:inline-block;vertical-align: top;line-height:1;width:23%;text-align:center;font-size:85%;margin:0 1% 15px 1%;}
#search ul li span{font-size:70%;margin-right:10px;}
#search ul li a{display:block;padding:15px;}
#search ul li a:hover{text-decoration:none;color: #fff;}
#search ul li:hover{text-decoration:none;background:#3198C0;color: #fff;cursor: pointer;text-decoration: none;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#search .all-width{width:92%;min-width:92%;}
}
@media screen and (max-width:600px){
#search{padding:70px 0;}
#search ul li{width:46%;text-align:center;font-size:85%;margin:0 1.5% 10px 1.5%;}
}
@media screen and (max-width:480px){
}
/*--------------------------------------------------------------------------------*/


/*商品表示*/
#item{}
#item .box{height:400px;}
#item .txt-box{width:50%;display: inline-block;vertical-align: top;text-align:center;}
#item .txt-box .inner{display:inline-block;text-align: left;width:400px;line-height:1.8;font-size: 75%;margin-top:100px;}
#item .l-box{display: inline-block;vertical-align: top;}
#item .r-box{display: inline-block;vertical-align: top;}
#item .maker{color:#3198C0;}
#item .item-name{font-size: 150%;margin-bottom: 5px;}
#item .setsumei{width:200px;line-height:1.4;font-size: 90%;}
#item .shousai{display:inline-block;color:#fff;
background: url(images/btn.png) repeat-y left center !important;width: 148px;margin-top: 15px;}
#item .shousai a{display:block;color:#fff;padding:3px 40px;}
#item .shousai a:hover{text-decoration:none;}
#item .shousai:hover{filter: alpha(opacity=65);-moz-opacity:0.65;opacity:0.65;}
#item .circle{
	color:#3198C0;
	display: inline-block;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	border: 1px solid #3198C0;
	text-align:center;
	line-height: 100px;
	margin: 20px 0 0 20px;
}


#item .img-box{width:50%;display: inline-block;vertical-align: top;}
#item .img-box img{width:100%;height:400px; object-fit: cover;}
#item .float-r{float:right;}
#item .float-l{float:left;}


/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#item .txt-box .inner{width:auto;margin:50px 10px;}
}
@media screen and (max-width:768px){
#item .box{height:auto !important;}
#item .txt-box .inner{width:auto;margin:50px 10px;text-align:center;}
#item .img-box img{height:370px;  object-fit: cover;}
#item .circle{
	width: 80px;
	height: 80px;
	line-height: 80px;
	margin: 20px 0 0 0;
}
#item .r-box{display:block;vertical-align: top;}
}
@media screen and (max-width:600px){
#item .txt-box .inner{padding:20px;}
}

@media screen and (max-width:480px){
#item .txt-box .inner{width:auto;margin:20px 10px;text-align:left;}
#item .txt-box{width:100%;display: inline-block;vertical-align: top;text-align:left;}
#item .l-box{display: inline-block;vertical-align: top;}
#item .r-box{display: inline-block;vertical-align: top;}
#item .circle{
	width: 80px;
	height: 80px;
	line-height: 80px;
	margin: 20px 0 0 20px;
}
#item .img-box{width:100%;display: inline-block;vertical-align: top;}
}
/*--------------------------------------------------------------------------------*/


/*Q＆A*/
#qanda{position:relative;padding: 120px 0;line-height: 1.4;background-color:#F8F5F5;}
#qanda h3{font-size:155%;}
#qanda h3 .en {font-size:50%;}
#qanda .all-width{position:relative;}
#qanda .box{width: 100%;text-align: left;margin-bottom:15px;}
#qanda .more-02{margin-top:20px;}

/*アコーディオン*/
.accordion-title{display: block;position: relative;margin:18px 0 0 0;background: #CCF4ED;padding:18px 42px 18px 22px;}
.accordion-title span{color:#3BB9A7;font-size:130%;margin-right:10px;font-weight: bold;}
.accordion-content{background-color:#fff;padding: 20px 25px;line-height:2.0;display: none;font-size:88%}

.accordion-container {
	position: relative;
	width: 100%;
	text-align: left;
	cursor: pointer;
}

.accordion-title:after {
	content: "";
	position: absolute;
	right: 30px;
	top: 38%;
	transition: all 0.2s ease-in-out;
	display: block;
	width: 10px;
	height: 10px;
	border-top: solid 2px #3BB9A7;
	border-right: solid 2px #3BB9A7;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}

.accordion-title.open:after {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	top: 42%;
}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
}
@media screen and (max-width:600px){
#qanda{padding: 70px 0 70px 0;}
.accordion-title:after {right: 20px;}
}
@media screen and (max-width:480px){
#qanda h3{margin-bottom:30px;}
}
@media screen and (max-width:400px){
#qanda .more{width:100%;}
}
/*--------------------------------------------------------------------------------*/


/*お知らせ*/
#news{background:#e0f2f6;position:relative;padding: 100px 0 120px 0;}
#news .inner{text-align:left;background:#Fff;padding:40px 50px 20px 50px;border-radius: 15px;-webkit-border-radius: 15px;-moz-border-radius: 15px;width: 850px;margin: 0 auto;}
#news h3{font-size:155%;}
#news h3 .en {font-size:50%;}
#news .listbox{display: inline-block !important;vertical-align: top !important;line-height:1;text-align:left !important;width:100% !important;margin:0 0 10px 0 !important;line-height:1.4;
padding:0 0 10px 0 !important;border-bottom: 1px solid #ddd;}
#news .date{display: inline-block;vertical-align: middle;padding-top:8px;}
#news .listbox ul li{display: inline-block !important;background:#66ACCC !important;border-radius: 14px;-webkit-border-radius: 14px;-moz-border-radius: 14px;}
#news .cate{display: inline-block;vertical-align:middle;margin:0 12px 0 0;font-size:60%;}
#news .cate a{display:block;text-decoration:none;color:#fff !important;border: none !important;background-color: none !important;padding:3px 10px;}
#news .title{margin:;display: inline-block;vertical-align:middle;font-size:70%;padding-top:0;}
#news .title a{}
#news .more-02{margin:50px 70px 0 70px;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#news .all-width{width:92%;min-width:92%;}
#news .inner{width:100%;}
}
@media screen and (max-width:600px){
#news{padding: 70px 0;}
#news .inner{padding:40px 30px 20px 30px;font-size:110%;}
#news .more-02{margin:30px 20px 0 20px;}
}
@media screen and (max-width:480px){
}
/*--------------------------------------------------------------------------------*/

/*アドレス/map*/
#add-map{}
.add-box{display: inline-block;vertical-align: top; width: 35%;background-color:#3198C0;height:500px;color:#fff;}
.gaikan-photo{height: 240px;}
.gaikan-photo img{height: 240px;object-fit: cover;width: 100%;}

#add-map .inner{padding:  40px 45px;line-height: 1.6;}
.company-names{font-size: 120%;}
.post-add{font-size: 70%;}
.tel-number{font-size:180%;font-family: 'Noto-Bold', sans-serif;letter-spacing: 0.1em;margin: 8px 0;}
.time-closed{font-size: 60%;}

.map-box{display: inline-block;vertical-align: top;width: 65%;}
.map-box iframe{background-color: #eee;width: 100%;height:500px}


/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1200px){
#add-map .inner{padding:  20px 25px;line-height: 1.6;}
.add-box{display: inline-block;vertical-align: top; width: 40%;background-color:#3198C0;height:500px;color:#fff;}
.map-box{display: inline-block;vertical-align: top;width: 60%;}
}

@media screen and (max-width:900px){
.company-names{font-size: 110%;}
.post-add{font-size: 70%;}
.tel-number{font-size:150%;font-family: 'Noto-Bold', sans-serif;letter-spacing: 0.1em;margin: 8px 0;}
.time-closed{font-size: 65%;}
}

@media screen and (max-width:768px){
.add-box{width: 50%;}
.map-box{width: 50%;}
}

@media screen and (max-width:600px){
#add-map .inner{line-height: 1.4;}
.add-box{display: inline-block;vertical-align: top; width: 100%;background-color:#3198C0;height:auto;color:#fff;}
.map-box{display: inline-block;vertical-align: top;width: 100% !important;height:300px;}
.map-box {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%; /* 比率を4:3に固定 */
}
 
/* Google Mapのiframe */
.map-box iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.tel-number{font-size:190%;}
}
/*--------------------------------------------------------------------------------*/


/*フッタ*/
footer{
	padding:100px 0 0 0 ;
	background:#f9f1e4;width: 100%;text-align: center;overflow: hidden;position: relative;min-width:1000px;z-index:0;
}
footer .yokumieru{margin:0 0 50px 0;}
footer .logos{margin:0 0 50px 0;}

footer .link-box{margin:0 0 50px 0;}
footer .link-box .link-btn{display:inline-block;vertical-align:top;font-size:90%;width:280px;background-color:#fff;padding: 20px 10px !important;border-radius: 10px;-webkit-border-radius: 10px;-moz-border-radius: 10px;margin: 0 30px;}
footer .link-box .link-btn a{text-decoration: none;display:block;}
footer .link-box .link-btn:hover{text-decoration:none;cursor: pointer;filter: alpha(opacity=65);-moz-opacity:0.65;opacity:0.65;}
.funakoshi-icon{}
.funakoshi-icon span{background:url(images/funakoshi-icon.png) no-repeat left center;background-size:21px auto !important;padding:20px 0 20px 25px;}
.tel-icon{background:#3198C0 !important;color:#fff;}
.tel-icon span{background: url(images/tel-icon.png) no-repeat left center !important;background-size:21px auto !important;padding:20px 0 20px 25px;}
.tel-icon a{color:#fff !important;}
footer .f-menu{font-size:85%;margin:0;margin-top:50px;line-height: 2.0;padding:0;border-top:1px solid #fff;}
footer .f-menu a{}
footer .f-menu a:hover{text-decoration:underline;}
footer .f-menu ul{display:inline-block;vertical-align:top;width:25%;padding:30px 15px;}
footer .f-menu li{display:block; margin:0 0 14px 0;text-align:left;line-height:1.3;
background:transparent url(images/maru.png) no-repeat left center;background-size:10px;padding-left:15px;margin-left:0;
}

footer .f-logo{margin:20px 0 50px 0;}
footer .copy{position:relative;padding:250px 10px 26px 10px;font-size:70%;color:#3198C0;
background:url(images/c-main.png) no-repeat center top;background-size:360px auto;}
footer .copy .f-l-ill{position:absolute;top:0;left:100px;}
footer .copy .f-r-ill{position:absolute;top:0;right:100px;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
footer{min-width:100%;width:100%;}
}
@media screen and (max-width: 900px){
footer .f-menu{font-size:75%;}
footer .f-menu ul{display:inline-block;vertical-align:top;width:25%;padding: 30px 15px;}
footer .copy .f-l-ill{position:absolute;top:0;left:10px;}
footer .copy .f-r-ill{position:absolute;top:0;right:10px;}
}
@media screen and (max-width: 768px){
footer .link-box .link-btn{margin: 0 10px 10px 10px;width:280px;padding: 15px 10px !important;font-size:75%;}
}
@media screen and (max-width: 600px){
footer{padding:70px 0 0 0 ;}
.yokumieru{display:block !important;width:140px;margin:0 auto 30px auto !important;}
.logos{display:block !important;width:300px;margin:0 auto 30px auto !important;}
footer .link-box{margin:0 ;1important}
footer .f-menu{margin-top:20px;}
footer .f-menu{padding:30px 0;border-top:1px solid #fff;}
footer .f-menu ul{display:inline-block;vertical-align:top;width:100%;padding: 0;text-align: left;}
footer .f-menu li{display:inline-block; margin:0 8px 8px 0;text-align:left;line-height:1.3;}

}
@media screen and (max-width: 480px){
	footer .copy{position:relative;padding:150px 10px 26px 10px !important;font-size:70%;color:#3198C0;
background:url(images/c-main.png) no-repeat center top;background-size:220px auto !important;}
footer .copy .f-l-ill{width:130px !important;height:auto;}
footer .copy .f-r-ill{width:130px !important;height:auto;}
}
@media screen and (max-width: 400px){
}
/*--------------------------------------------------------------------------------*/


/* スクロールアクション用 */
.invisible {
	transition: opacity 0.5s ease;
	opacity: 0.0;
}

.visible {
	transition: opacity 0.5s ease;
	opacity: 1.0;
}

.block {
	/* 1秒遅れてアニメする */
	animation-delay: 1s;
}
.fade {
	-webkit-animation-duration: 5s;
	animation-duration: 5s !important;
}

/* Webkit */
::-webkit-input-placeholder {
	color: #fff;
	opacity: 1;
}
/* Firefox 18 以前 */
:-moz-placeholder {
	color: #fff;
}
/* Firefox 19 以降 */
::-moz-placeholder {
	color: #fff;
	opacity: 1;
}
/* IE 10 以降 */
:-ms-input-placeholder {
	color: #fff;
}



@keyframes return {
	0% {
	transform: translateX(0px);
}
50% {
	transform: translateX(-6px);
}
100% {
	transform: translateX(0px);
}
}
.return {
	animation-name: return;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-timing-function: ease;
}

@keyframes return02 {
	0% {
	transform: translateX(0px);
}
50% {
	transform: translateX(-20px);
}
100% {
	transform: translateX(0px);
}
}
.return02 {
	animation-name: return02;
	animation-duration: 6s;
	animation-iteration-count: infinite;
	animation-timing-function: ease;
}

@keyframes return03 {
	0% {
	transform: translateX(0px);
}
50% {
	transform: translateX(-15px);
}
100% {
	transform: translateX(0px);
}
}
.return03 {
	animation-name: return03;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: ease;
}

@keyframes return04 {
	0% {
	transform: translateY(0px);
}
50% {
	transform: translateY(-15px);
}
100% {
	transform: translateY(0px);
}
}
.return04 {
	animation-name: return04;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: ease;
}
