@charset "utf-8";

* {
	padding: 0;
	margin: 0;
}

html {
    height: 100%;
  scroll-padding-top: 80px;
}
body {
	height: 100%;
	color: #000;
	/*font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";*/
	font-family: "游明朝", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", YuMincho, "HG明朝E", "Sawarabi Mincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	word-wrap: break-word;
	margin-bottom: 20px;
	-webkit-text-size-adjust: 100%;
	font-size: 16px;
	text-align:justify;
}
.gothic {
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
}
img {
	vertical-align: top;
}
section,
article {
	display: block;
}

a img {
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
a:hover img, form.contact_form input.form_btn:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
li {
	list-style-type: none;
}
a {
	color: #0066CC;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
a:hover {
	color: #0099CC;
	text-decoration: none;
}

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

img.img_left {
	background-color: #F6F6F6;
	padding: 10px;
	float: left;
	display: block;
	margin-right: 20px;
	margin-bottom: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

img.img_right {
	background-color: #F6F6F6;
	padding: 10px;
	float: right;
	display: block;
	margin-left: 20px;
	margin-bottom: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}



.top-maruoyama {/*トップ丸尾山写真*/
	background: url(img/top_maruoyama.png) no-repeat 95.5% 3px / contain;
}

p.press {/*トップ見出し文*/
	margin-top: 30px!important;
	line-height: 2em!important;
	font-size: 1.15em!important;
	color: black;
	text-shadow: 2px 1px 1px #fff;
}
.press span {
	color: #6d06d4;
	font-size: 1.2em;
	font-weight: 500;
}
/*フェイスブック
---------------------------------------------------------------------------*/

#block-fb {
	max-width: 500px;
	width: auto;
	height: 500px;
	margin: 0 auto;
	text-align: center;
}

.fs08 {
	font-size: 0.8em;
}
.color1{       /*ピンク*/
	color: #fe6767;
}
.color2{       /*基本*/
	color: #00365e;
}
.color3{       /*紫*/
	color: #6d06d4;
}
.color4{       /*赤*/
	color: red;
}
.bold {
	font-weight: bold;
}
.letter-s {
	letter-spacing: -0.1em;
}
.g_map {
	padding: 2px;
	background-color: #FFF;
	margin: 30px auto 10px;
	border: 10px solid #F6F6F6;
}

.jump {
	padding-top: 90px;
	margin-top: -90px!important;
}

@media(min-width:1025px){
    .sp{
        display: none !important;
}
}
@media(max-width:1024px){
    .pc{
        display: none !important;
}
}


/*
ヘッダー
-------------------------------------------*/
header {
	width: 100%;
	display: block;
	position: relative;
	background-color: #00365E;
	border-bottom-style: solid;
	border-bottom-width: 10px;
	border-bottom-color: #EEE;
	background-size: cover;
}

.toppage header {
	height: auto !important;
}

header.header_bg_01 {
	background-image: url(img/top_image_01.jpg);
}
header.header_bg_02 {
	background-image: url(img/top_image_02.jpg);
}
header.header_bg_03 {
	background-image: url(img/top_image_03.jpg);
	background-position: right center; 
}
header.header_bg_04 {
	background-image: url(img/top_image_04.jpg);
}

header h1 {
	top: 15px;
	font-weight: normal;
	font-size: 10px;
	line-height: 20px;
	position: absolute;
	z-index: 1000;
}

header .h_box {
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
}

header .h_btn a {
	display: block;
	font-size: 16px;
	line-height: 30px;
	color: #00365E;
	text-decoration: none;
	width: 180px;
	padding-right: 10px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	box-shadow: rgba(0, 15, 44, 0.3) 0px 0px 7px 0px;
	-webkit-box-shadow: rgba(0, 15, 44, 0.3) 0px 0px 7px 0px;
	-moz-box-shadow: rgba(0, 15, 44, 0.3) 0px 0px 7px 0px;
	background-color: #FFF;
	text-align: center;
	font-weight: bold;
	letter-spacing: 1px;
	position: relative;
}

header .h_btn a::after {
	font-size: 10px;
	display: block;
	width: 30px;
	line-height: 26px;
	position: absolute;
	top: 2px;
	right: 0px;
	content: '>';
	text-align: center;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #A2CAD5;
}

header .h_btn a:hover {
	color: #FFF;
	box-shadow: rgba(0, 50, 150, 0.3) 0px 0px 7px 0px;
	-webkit-box-shadow: rgba(0, 50, 150, 0.3) 0px 0px 7px 0px;
	-moz-box-shadow: rgba(0, 50, 150, 0.3) 0px 0px 7px 0px;
	background-color: #00365E;
}

header .h_box {
	background-color: rgba(0,0,0,0.2);
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

header .h_box .h_list li a {
	display: block;
	float: left;
	font-size: 14px;
	line-height: 20px;
	color: #FFF;
	padding-left: 20px;
	padding-right: 20px;
	text-decoration: none;
	margin-top: 5px;
	border-right-style: solid;
	border-right-width: 1px;
	border-right-color: #FFF;
}

header .h_box .h_list li:last-child a {
	border-right-style: none;
}

header .h_box .h_list li a:hover {
	background-color: rgba(0,0,0,0.3);
}
header .h_box ul.h_lang {
	display: block;
	float: right;
	width: 160px;
	height: 30px;
}

header .h_box .h_lang li a {
	display: block;
	float: left;
	font-size: 14px;
	line-height: 23px;
	color: #00365E;
	text-align: center;
	text-decoration: none;
	width: 150px;
	margin-left: 6px;
	margin-top: 1px;
	padding: 2px 6px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
header .h_box .h_lang li a.selected {
	background-color: #00365E;
	color: #FFFFFF;
	box-shadow: rgba(255, 255, 255, 0.3) 0px 0px 3px 0px;
	-webkit-box-shadow: rgba(255, 255, 255, 0.3) 0px 0px 3px 0px;
	-moz-box-shadow: rgba(255, 255, 255, 0.3) 0px 0px 3px 0px;
}
header .h_box .h_lang li a:hover {
	background-color: #dae2f2;
	color: #00365e;
}

header .h_tel {
	font-family: 'EB Garamond', "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "Sawarabi Mincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	margin-top: 5px;
	letter-spacing: 4px;
	line-height: 1em;
}

header .h_tel a {
	color: #FFF;
	text-decoration: none;
	-moz-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
-webkit-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
-ms-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}

header .h_tel i {
	padding-right: 10px;
}
header .h_tel span {
	letter-spacing: 0;
	font-size: 0.8em;
	color: #fff;
}

/*
グローバルナビ
-------------------------------------------*/

#g_navi {
	font-size: 15px;
}

#g_navi ul li a.ac_menu {
	cursor: pointer;
}

/*
パン屑
-------------------------------------------*/
.pankuzu {
	display: block;
	padding: 10px;
	background-color: #F9F9F9;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
}
.pankuzu li {
	display: inline-block;
	font-size: 14px;
	color: #666;
}
.pankuzu li::after {
	content: "＞";
	padding-left: 10px;
	color: #AAA;
	font-size: 12px;
}
.pankuzu li:last-child::after {
	content: "";
}

/*
２カラムコンテンツ
-------------------------------------------*/
.content_grid {
	margin-right: auto;
	margin-left: auto;
	padding-top: 50px;
	display: grid;
	gap: 40px;
	grid-template-columns: minmax(250px, 1fr) 2fr;
	grid-template-areas:
	"side_grid main_grid_a"
	"main_grid_b main_grid_b";
	position: relative;
	background-image: url(img/bg.jpg);
}
.main_grid_a {
	grid-area: main_grid_a;
	background-image: url(img/bg.jpg);
}
.side_grid {
	grid-area: side_grid;
	position: absolute;
	top: 0;
	right: 0;
	background: url(img/haikei.gif);
	align-self: center;
}
.main_grid_b {
	grid-area: main_grid_b;
	background: #fff;
}

/*
サイドバー
-------------------------------------------*/
/*　カレンダー用　*/
#pc{
	display:block;
	margin: 0 auto;
	padding: 10px;
}
#sp{
	display:none;
}

.side_cont {
	width: 280px;
	display: block;
	margin: 10px auto;
}

.side_white {
	background-color: #fff;
	width: 250px;
	display: block;
	margin: 10px auto;
}
.side_title {
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
	color: #192b00;
	font-size: 1rem;
	line-height: 1.2em;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 5px auto 5px;
	font-weight: bold;
}

.side_title::before,
.side_title::after {
	content: '';
	width: 50px;
	height: 3px;
	background-color: #192b00;
}

.side_title::before {
	margin-right: 10px;
}
.side_title::after {
	margin-left: 10px;
}
.side_tel {
	font-size: 1.8rem;
	text-align: center;
	color: #365e00;
}
.side_tel i {
	font-size: 1.4rem;
	padding-right: 10px;
}
.side_cont p {
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
	margin: 5px 8px;
	font-size: 0.8rem;
	letter-spacing: -1.5px;
	color: #192b00;
	font-weight: bold;
	
}

/*鳥山追加*/
.side_cont .color4{
	color: red;
	font-size: 0.9rem;
}
/*鳥山追加↑*/

.side_link {
	width: 250px;
	display: block;
	margin: 10px auto;
}
.side_link a {
	text-align: center;
	height: 45px;
	width: 100%;
	background-color: #333;
	line-height: 43px;
	display: block;
	color: #FFF;
	text-decoration: none;
	position: relative;
	border-radius: 3px;
	/*margin-top: 10px;*/
}
.side_link a:after {
	content: "";
	border-bottom: 10px solid #FFF;
	border-left: 10px solid transparent;
	position: absolute;
	right: 3px;
	bottom: 3px;
	color: #FFF;
	text-decoration: none;
}
.side_link a:hover {
	background-color: #365e00;
}
.side_purple {
	width: 250px;
	display: block;
	margin: 10px auto;
}
.side_purple a {
	height: 48px;
	width: 100%;
	background-color: #6d37a3;
	line-height: 48px;
	display: block;
	color: #FFF;
	text-decoration: none;
	position: relative;
	border-radius: 3px;
	margin-top: 10px;
	text-align: center;
}
.side_purple a:after {
	content: "";
	border-bottom: 10px solid #FFF;
	border-left: 10px solid transparent;
	position: absolute;
	right: 3px;
	bottom: 3px;
	color: #FFF;
	text-decoration: none;
}
.side_purple a:hover {
	background-color: #e8d5fb;
	color: #6d37a3;
}
.side_contact {
	width: 250px;
	display: block;
	margin: 10px auto;
}
.side_contact a {
	height: 48px;
	width: 100%;
	background-color: #996666;
	line-height: 48px;
	display: block;
	color: #FFF;
	text-decoration: none;
	position: relative;
	border-radius: 3px;
	margin-top: 10px;
	text-align: center;
}
.side_contact a:after {
	content: "";
	border-bottom: 10px solid #FFF;
	border-left: 10px solid transparent;
	position: absolute;
	right: 3px;
	bottom: 3px;
	color: #FFF;
	text-decoration: none;
}
.side_contact a:hover {
	background-color: #365e00;
}

/*サイドメニュー*/
#side_menu {
	width: 250px;
	display: block;
	margin: 10px auto 15px;
	text-align: center;
}
#side_menu h2 {
	font-weight:normal;
	font-size: 98%;
	padding: 3px 10px;
	background: #996666;
	color: #fff;
	letter-spacing: 3px;
	margin-bottom: 0;
}
#side_menu ul.side_submenu {
	background: #D5D8D0;
}
/*サイドメニュー１個ごとの設定*/
#side_menu ul.side_submenu li a {
	text-decoration: none;
	display: block;
	padding: 5px;
	color: #000;
}
.even{
	width: 35%;
	-moz-text-align-last: justify;
	text-align-last: justify;
	margin-left: 80px;
}
#side_menu ul.side_submenu li {
	border-bottom: 1px solid #fff;
}
#side_menu .active {
	background-color: #cfd3af;	
}
/*マウスオン時の設定*/
#side_menu ul.side_submenu li:hover {
	background-color: #BBC18E;	
}
#side_menu ul.side_submenu li a:hover {
	color: #fff;
}
#sub ul.side_submenu li:last-child {
	border:none;
}




/*
メインコンテンツ
-------------------------------------------*/
.content, .content-a {
	clear: both;
}
.content-a {
	width: 920px;
	margin-left: 0;
	padding: 50px 10px 30px;
	background-color: #fff;
}
.main_cont {
	margin-bottom: 10px;
}
.content::after, .content-a::after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}

.content p, .content-a p {
	line-height: 1.7;
	font-size: 16px;
	margin-bottom: 30px;
	margin-right: 15px;
	margin-left: 15px;
	margin-top: 10px;
}

.content-title {　　/*サブメニューがある場合の親メニュー用　緑2重アンダーライン*/
  text-align: center;
  padding-bottom: 40px;
  position: relative;
}
.content-title h2 {
  text-align: center;
  font-size: 32px;
  font-weight: 500;
  margin-bottom: 20px;
  padding-bottom: 20px;
  position: relative;
}
.content-title h2:before {
  content: "";
  position: absolute;
  display: block;
  width: 150px;
  height: 1px;
  background: color-mix(in srgb, #365e00, transparent 60%);
  left: 0;
  right: 0;
  bottom: 1px;
  margin: auto;
}

.content-title h2::after {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 2px;
  background: #365e00;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}


h2.title_02 {               /*各ページ　黄色アンダーライン*/
	color: #585858;
	margin: 20px 5px;
	text-align: center!important;
	font-size: 1.7rem;
	font-weight: 500;
	border-bottom:solid 1px #d5c298;
	line-height: 28px;
}
h2 {
	font-size: 28px;
	line-height: 40px;
	color: #00365E;
	margin-bottom: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
	position: relative;
	display: block;
	font-weight: normal;
}
h2 i {
	padding-right: 10px;
	color: #4694B9;
	font-size: 22px;
}
h2 a.btn_list {
	font-size: 14px;
	line-height: 30px;
	text-decoration: none;
	display: block;
	width: 105px;
	position: absolute;
	top: 10px;
	right: 0px;
	letter-spacing: 0px;
	padding-left: 30px;
	color: #FFF;
	background-color: #00365E;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

h2 a.btn_list::before {
	font-size: 10px;
	display: block;
	width: 20px;
	line-height: 30px;
	position: absolute;
	top: 0px;
	left: 15px;
	content: '>';
}

h2 a.btn_list:hover {
	background-color: #FFF;
	color: #00365E;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 5px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 5px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 5px 0px;
}

h2.h2_title_01 {
	border-top-width: 5px;
	border-top-style: solid;
	border-top-color: #066C93;
	background-color: #F9F9F9;
	padding: 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #DDD;
}
h3.h3_title_04 {         /*砥石について（全サブページ）先頭青丸のデザイン*/
  font-size: calc(1.3rem + 1vw);
  font-weight: 600;
  line-height: 1.2;
	margin: 50px 0 25px 20px;
	font-style: italic !important;
	color: #00365e;
	position: relative;
	z-index: 100;
}
h3.h3_title_04:before {
  content: "";
  position: absolute;
  background: #9de5ff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  top: 50%;
  left: -15px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: -1;
}
@media (min-width: 1200px) {
h3.h3_title_04 {
    font-size: 1.6rem;
  }
}

h3.title_03 {/*トップ丸尾山130年*/
	font-size: 19px;
	margin-left: 10px;
	margin-right: 8px;
	padding-left: 10px;
	padding-right: 10px;
	font-weight: 800;
	background-color: #365e00;
	color: #fff;
}
h3.title_01 {         /*メディア情報リストタイトル*/
	font-size: 20px;
	line-height: 30px;
	font-weight: normal;
	color: #FFFFFF!important;
	/*letter-spacing: 1px;*/
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 5px 0;
	background-color: #869e66!important;
	display: block;
	position: relative;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	border: 1px solid #FFFFFF;
	clear: both;
}

h3.title_02 {               /*ご注文方法*/
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
	font-size: 19px;
	line-height: 30px;
	font-weight: normal;
	color: #044760;
	letter-spacing: 1px;
	margin-top: 20px;
	margin-bottom: 20px;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 36px;
	background-color: #F6F6F6;
	display: block;
	position: relative;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
}
h3.title_02::before {
	display: block;
	width: 2px;
	height: 24px;
	position: absolute;
	content: "";
	top: 13px;
	left: 20px;
	background-color: #044760;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
h4.title_01 {                /*ご注文方法サブ　丸尾山の天然砥石サブ*/
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
	font-weight: bold;
	margin: 5px;
	position: relative;
	padding: .5rem;
	color: #00365e;
}

h4.title_01:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 40%;
  height: 4px;
  content: '';
  border-radius: 3px;
  background-image: -webkit-gradient(linear, right top, left top, from(#e5f7ff), to(#d4e1f9));
  background-image: -webkit-linear-gradient(right, #e5f7ff 0%, #d4e1f9 100%);
  background-image: linear-gradient(to left, #e5f7ff 0%, #d4e1f9 100%);
}
h4.title_01 i {
	font-size: 1.4rem;
	color: #4b7cdf;
}
h4.title_05 {      /*丸尾山天然砥石の種類 水色帯・角三角*/
	position: relative;
	padding: 5px 5px 5px 80px;
	background: #4d9bc1;
	font-size: 20px;
	color: white;
	margin: 20px 20px 20px 5px;
	line-height: 1.3;
	z-index:1;
	width: 98%;
}

h4.title_05:before {
	position: absolute;
	content: '';
	left: -2px;
	top: -2px;
	border: none;
	border-left: solid 70px white;
	border-bottom: solid 79px transparent;
	z-index:0;
}
h4.title_05 span {
	font-size: 0.7em;
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
}

/*
お知らせ
-------------------------------------------*/
.news h2 span {
	background-color: #365e00;
	color: #fff;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 5px 0px;
	border-radius: 5px;
	padding: 3px 15px;
	font-size: 0.8em;
}
@media (max-width: 640px){
.news {
	margin-top: 20px;
}
.news h2 span {
	font-size: 1em;
}
}
.news ul {
	margin: 0 10px;
}

.news ul li {
	font-family: "Open Sans", sans-serif;
	font-size: 15px;
	color: #333;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: dotted 1px #B5A57B;
	line-height: 1.8em;
}
.news ul li span {
	color: #deb285;
	font-weight: bold;
	font-style: italic !important;
	font-size: 0.9em;
}
/*---- リンク線など消す
.news ul li a {
	color: #333;
	text-decoration: none;
	letter-spacing: 1px;
}
----------*/

/*----特別告知の三角印----------*/
ul.info {
	margin: 20px 20px;
}
.info li {
	position:relative;
  padding: 0 0 0 20px;
  margin: 7px 0 14px 0px;
  font-size:16px;
  line-height: 32px;
  border-bottom: dashed 1px #deb285;
}
.info li:before{
  counter-increment: list;
  content: "";
  display: block;
  position: absolute;
  left: 0px;
  height: 0;
  width: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 7px solid #deb285;
  top: 1em;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

/*
トップフォーム
-------------------------------------------*/

.top_catch {
	position: absolute;
	top: 40%;
	left: 44%;
	z-index: 100;
	font-size: 2.3em;
	color: #fff;
	text-shadow: 3px 3px 5px rgba(0,0,0,0.8);
	line-height: 0.9em;
	font-weight: 800;
}
.top_catch span{
	font-size: 0.6em;
}
@media (max-width: 1300px){
.top_catch {
	left: 30%;
	font-size: 2em;
}
}
@media (max-width: 768px){
.top_catch {
	font-size: 1.8em;
	top: 50%;
	left: 20%;
}
}
@media (max-width: 767px){
.top_catch {
	font-size: 1.3em;
	left: 30%;
}
}
@media (max-width: 480px){
.top_catch {
	top: 60%;
	left: 10%;
	font-size: 1em;
	line-height: 1em;
}
}
/*
4列メインコンテンツ   （index/東物・about/アクセス）
-------------------------------------------*/
.flex4 {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	justify-content: space-center;
	margin: 0 30px;
}
.col4 {
	flex-basis: 23%;
	padding: 10px 5px 0;
}
.col4 img {
	width: 100%;
	box-shadow: 2px 1px 4px 0 rgba(198, 220, 255, .4);
}
/*アクセス行き方詳細、分析顕微鏡写真*/
#About .col4 p, #Analysis .col4 p {
	margin: 7px 5px 5px;
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
	line-height: 1.5;
	text-align:start;

}
.col4 p>span.small {
	font-size: 14px;
}

.maru {   /*アクセス丸数字*/
	display: inline-block;
	background: #4c728e;
	border-radius: 50%;
	width: 18px;
	height: 18px;
	color: #fff;
	font-size: 14px;
	text-align: center;
	line-height: 18px;
	margin: 2px 5px 0 0;
	vertical-align: text-top;
}

@media (max-width: 648px){
.flex4 {
	margin: 0 5px;
}
.col4 {
	flex-basis: 48%;
}
}

/*
３列メインコンテンツ
-------------------------------------------*/
.cont_list {
	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;
	margin-top: 40px;
}

.cont_list::after {
  content:"";
  display: block;
  width:32%;
}

.cont_list .list_box {
	width: 32%;
	background-color: #EEE;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 5px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 5px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 5px 0px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border: 2px solid #FFF;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
	margin-bottom: 20px;
}



.cont_list .list_box:hover {
	background-color: #FFF;
	box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px 0px;
}

.cont_list .list_box h2 {
	text-align: center;
	padding-top: 20px;
	background-color: #FFF;
	border-bottom-width: 4px;
	border-bottom-style: solid;
	border-bottom-color: #2E749A;
	font-size: 22px;
	line-height: 30px;
	padding-bottom: 10px;
}

.cont_list .list_box h3 {
	font-size: 18px;
	text-align: center;
	margin-top: 0px;
	padding-right: 0px;
	padding-left: 0px;
	color: #044760;
	background-color: #F9F9F9;
	border-bottom-color: #BBB;
	box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px;
	border-bottom-style: dotted;
}

.list_box p {
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
	font-size: 0.9em;
	margin-bottom: 15px;
}

.cont_list .list_box img {
	width: 96%;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 15px;
	margin-bottom: 15px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
#Mass .cont_list .list_box img {
	height: 250px;
	object-fit: cover;
	object-position: 0 top;
}
/*
３列 枠無し  丸尾山
-------------------------------------------*/
.col3 {
	width: 96%;
	display: flex;
	margin: 20px 5px;
}
.col3 > div {
    width: calc( ( 100% - 60px ) / 3 );
    margin-right: 30px;
}
.col3 > div:nth-child( 3n ) {
    margin-right: 0;
}
.col3 img {
    width: 100%;
}
.col3 p {
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
	line-height: 1.2;
}

@media (max-width: 760px){
.col3 {
	flex-direction: column;
}
.col3 > div {
    width: 100%;
    margin-right: 0;
}
}

/*
帯（砥石一覧）部分
-------------------------------------------*/
.obi_toishi {
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	background: url(img/top04.jpg) center center no-repeat fixed;
	background-size: cover;
	background-color:rgba(255,255,255,0.8);
	background-blend-mode:lighten;
	text-align: center;
}
@media (max-width: 768px) {
.obi_toishi {
background-attachment: scroll;
}
}
.chart h2 {
	text-align: center;
	color: #00365e;
	margin-bottom: 30px;
	padding-bottom: 15px;
}
.chart ul {
	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;
}

.chart ul li {
	display: block;
	width: 25%;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 20px 5px;
	color: #FFF;
}

.chart ul li p {
	color: #00365e;
	margin: 10px;
}
.chart ul li a {
	text-decoration: none;
	color: #FFF;
}
.chart ul li p strong {
	font-size: 18px;
	font-weight: normal;
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
}
.chart ul li p i {
	color: #4c728e;
	margin-left: 10px;
}
.chart ul li a .mask {
	width: 200px;
	height: 200px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	margin-top: 10px;
	overflow: hidden;
	position: relative;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
.chart ul li a img {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	display: block;
}
.chart ul li a:hover img {
	width: 120%;
	max-width: 120% !important;
	top: -10%;
	left: -10%;
	opacity: 1.0;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}

/*
帯（東物など青帯）部分
-------------------------------------------*/

.obi {
	background-color: #002744;
	width: 100%;
	padding-top: 20px;
	padding-bottom: 50px;
	/*margin-top: 20px;
	margin-bottom: 50px;*/
	background-image: url(img/obi.png);
	background-repeat: no-repeat;
	background-position: center 2px;
}

.obi h2 {
	text-align: center;
	color: #FFF;
	margin-bottom: 30px;
	background-image: url(img/obi.png);
	background-repeat: no-repeat;
	background-position: center 59px;
	padding-bottom: 15px;
}
.service p {
	color: #FFF;
}

.list_box a.btn_more {
	text-align: center;
	text-decoration: none;
	color: #FFF;
	background-color: #002744;
	margin-bottom: 20px;
}
.list_box a.btn_more:hover {
	color: #002744;
	background-color: #FFF;
	border-top-color: #001F35;
	border-right-color: #001F35;
	border-bottom-color: #001F35;
	border-left-color: #001F35;
}

/*---------------------------------------
砥取家について
-----------------------------------------*/
.brand_grid {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0 5px;
}
.brand-txt {
	grid-column: 1;
	background: url(img/about/about3.png) no-repeat 5px bottom / contain;
}
.brand-img {
	grid-column: 2;
}

/*
帯（老舗表彰）部分
-------------------------------------------*/
.obi_shinise {
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	background: url(img/about/bg_shinise.jpg) center center no-repeat fixed;
	background-size: cover;
	background-color:rgba(255,255,255,0.6);
	background-blend-mode:lighten;
}
/*
サブメニュー    砥取家について/ご注文について/天然砥石について
-----------------------------------------------------------------*/
.submenu {
	margin: 10px auto 30px;
	list-style: none;
	display: flex;
	justify-content: center;
	flex-flow: wrap;
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
}
.submenu li {
	display: flex;
	width: 200px;
}
.submenu li a {
	width: 200px;
	text-align: center!important;
	margin: 7px;
	border-radius: 4px;
	transition: 0.5s;
	color: #fff;
	background: #00365e;
	padding: 8px 15px;
	text-decoration: none;
	font-size: 0.9rem;
}
.submenu li a:hover {
	color: #00365e;
	border: 2px solid #4c728e;
	background: #fff;
}
@media (max-width: 768px) {
.submenu li {
	width: 170px;
}
.submenu li a {
	padding: 8px;
}
}
@media (max-width: 375px) {
.submenu li {
	width: 160px;
}
}

/*
丸尾山の天然砥石
-------------------------------------------*/

 /*四角チェックリスト　丸尾山天然砥石・天然砥石の選び方*/
.sq_list {
	margin: 20px 10px 50px;
	font-size: 1.15em;
}
.sq_list li {
  position: relative;
  padding-left: 1.8em;
	padding-bottom: 5px;
	margin-bottom: 20px;
	border-bottom: 1px dashed #9de5ff;
}
.sq_list li::before {
  font-family: "Font Awesome 5 Free";
  content: '\f14a';
  font-weight: 900;
  position: absolute;
  top: 3px;
  left: 10px;
	color: #00365e;
}

/*丸尾山天然砥石の特徴バナー風ボックス、返品交換（ご注文について）、天然砥石の分析 */
.box1 {
	margin: 2em;
	background-color:#f4f9ff;
	border:1px solid #84c1ff;/*枠線*/
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
	color:#000000;
	padding: 1em 1.5em;
}
.box1 p {
    margin: 0; 
    padding: 0;
	font-weight: bold;
}

@media (max-width: 680px) {
.box1 {
	padding: 15px 8px;
	margin: 2em 0.7em;
}
}
/*
天然砥石の分析
-------------------------------------------*/
.box1 dt {
	float: left;
	width: 5em;
}
.box1 dd {
	padding-left: 6em;
}



/*
研ぎ体験
-------------------------------------------*/
.grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.grid img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}


/*
FAQ
-------------------------------------------*/
.dl_faq dt {
	font-size: 20px;
	line-height: 30px;
	color: #FFF;
	background-color: #066C93;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 60px;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	position: relative;
}
.dl_faq dt::before {
	display: block;
	font-size: 24px;
	line-height: 50px;
	width: 50px;
	text-align: center;
	font-weight: bold;
	content: "Q.";
	position: absolute;
	top: 0px;
	left: 10px;
}
.dl_faq dd {
	margin-bottom: 30px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 30px;
	padding-left: 60px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	position: relative;
}
.dl_faq dd::before {
	display: block;
	font-size: 24px;
	line-height: 50px;
	width: 50px;
	text-align: center;
	font-weight: bold;
	content: "A.";
	position: absolute;
	top: 10px;
	left: 10px;
	color: #fe6767;
}
.dl_faq ul {
	color: #ff7a7a;
	margin: 10px 0 10px 50px;
}
.dl_faq ul li {
	list-style-type: disc;
}
.dl_faq br.air {
	display: block;
	content: "";
	height: 10px;
}
/*
お問い合わせ枠
-------------------------------------------*/
.contact {
	text-align: center;
	background-color: #F9F9F9;
	border: 2px solid #FFF;
	margin-bottom: 50px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 7px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 7px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 7px 0px;
	margin-top: 50px;
}
.contact  h2 {
	background-color: #F6F6F6;
	padding-top: 20px;
	padding-bottom: 15px;
	border-radius: 10px 10px 0 0 / 10px 10px 0 0;
	-webkit-border-radius: 10px 10px 0 0 / 10px 10px 0 0;
	-moz-border-radius: 10px 10px 0 0 / 10px 10px 0 0;
	border-bottom-width: 5px;
	border-bottom-style: solid;
	border-bottom-color: #066C93;
}
.contact .tel a {
	font-size: 30px;
	color: #004F88;
	text-decoration: none;
}
.contact .tel a i {
	padding-right: 10px;
}
.contact .tel a strong {
	font-size: larger;
	font-weight: normal;
}

.btn_contact a {
	display: block;
	padding-top: 15px;
	padding-bottom: 13px;
	background-color: #066C93;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	font-size: 20px;
	line-height: 30px;
	color: #FFF;
	text-decoration: none;
	width: 90%;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 20px;
	margin-left: auto;
	border: 1px solid #FFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 7px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 7px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 7px 0px;
}
.btn_contact a:hover {
	background-color: #FFF;
	color: #066C93;
	border: 1px solid #066C93;
}
.btn_contact a i {
	padding-right: 10px;
}


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

footer {
	clear: both;
	padding-top: 20px;
	padding-bottom: 10px;
	display: block;
	color: #FFFFFF;
	color: rgba(255,255,255,0.8);
	background-color: #00365E;
	border-top-width: 10px;
	border-top-style: solid;
	border-top-color: #F6F6F6;
}

.footer_box {
	padding-top: 30px;
	padding-bottom: 20px;
}
.foot_logo {
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.footer_box ul li .li_title {
	padding-bottom: 5px;
	margin-bottom: 5px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #49697A;
	font-size: 14px;
	letter-spacing: 1px;
}
.footer_box ul li a {
	color: #FFF;
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	text-decoration: none;
	display: block;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 24px;
	font-size: 14px;
	line-height: 22px;
	position: relative;
}
.footer_box ul.fs09e li a {
	font-size: 0.95em;
}
.footer_box ul li a::before {
	font-size: 10px;
	display: block;
	width: 10px;
	line-height: 22px;
	position: absolute;
	top: 5px;
	left: 10px;
	content: '・';
}
.footer_box ul li a:hover {
	opacity: 1.0;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}

.footer_box ul {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.footer_box ul li ul {
	width: 100% !important;
}

address {
	font-size: 10px;
	font-style: normal;
	text-align: center;
	letter-spacing: 1px;
	line-height: 20px;
	padding-top: 10px;
	display: block;
}

/*
PR枠
-------------------------------------------*/
.box_pr {
	font-size: 10px;
	line-height: 20px;
	color: #A2B6C8;
	background-color: #002139;
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
	letter-spacing: 1px;
}
.box_pr li {
	display: inline-block;
	margin: 5px;
}
.box_pr li a {
	color: #A2B6C8;
}

/*
トップへ戻るボタン
-------------------------------------------*/
#to_top {
	position: fixed;
	bottom: 10px;
	right: 30px;
	z-index: 200;
}
#to_top a {
	text-decoration: none;
	text-align: center;
	display: block;
	width:50px;
	height:50px;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	padding-top: 15px;
	background-color: rgba(0,34,83,0.8);
}
#to_top a:hover,
#to_top a:hover img {
	background-color: rgba(0,34,83,1.0);
}

/*
テーブル
-------------------------------------------*/

table {
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
	border-collapse: collapse;
}
table td {
	border-collapse: collapse;
	line-height: 1.8em;
}

table.table_01,           /*ご注文について、 参考価格（天然砥石の選び方）*/
#mailform table.table_form {
	width: 98%;
	margin: 30px auto;
}
table.table_01 th,
table.table_01 td {
	padding: 15px 30px;
	font-size: 15px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #E3E3E3;
}
table.table_01 th {
	text-align: center;
	background-color: #F9F9F9;
	color: #00365E;
	letter-spacing: 2px;
	width: 30%;
}
#Choice .table_01 {    /*参考価格（天然砥石の選び方）*/
	text-align: center;
}
#Choice .table_01 th {
	width: 40%;
}

.table_02 {　　　　　　/*天然砥石の特徴（天然砥石について）丸尾山天然砥石の種類（丸尾山の天然砥石）*/
	border-collapse: collapse;
	width: 100%;
	max-width: 700px;
	margin: 0 auto 30px;
}
.table_02 th, .table_02 td {
	border-bottom: 2px solid #c1c7c6;
	padding: 1em;
}
.table_02 th {
  border-bottom: 2px solid #4d9bc1;
  font-weight: bold;
  text-align: center;
  width: 25%;
}
.table_03 {　　　　/*丸尾山天然砥石の硬度（丸尾山の天然砥石）*/
	width: 98%;
	margin-top: 30px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
}
.table_03 th,
.table_03 td{
	padding: 15px;
	font-size: 15px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #E3E3E3;
}
.table_03 thead th {
	background-color: #F9F9F9;
	color: #00365E;
	letter-spacing: 2px;
	text-align: center;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #E3E3E3;
}
.table_03 tbody th {
	width: 20%;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #E3E3E3;
}
.table_03 tbody td:nth-child(-n+2) {
	width: 25%;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #E3E3E3;
}


.table_04 {  /*送料*/
	width: 98%;
	margin-top: 30px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
}
.table_04 th {         
	background-color: #F9F9F9;
	border-right: solid 1px #ccc;
	color: #00365E;
	border-bottom: 1px solid #c1c7c6;
	padding: 10px;
	text-align: center;
}
.table_04 td {
	border-bottom: solid 1px #ccc;
	border-right: solid 1px #ccc;
	padding: 10px;
	text-align: center;
}
.table_04 th:last-child, .table_04 td:last-child {
	border-right: none;
}
table.table_05 {  /*砥石の規格*/
	width:98%;
	border-collapse: collapse;
	margin: 10px auto!important;
	line-height: 1em;
}
.table_05 th,
.table_05 td{
	padding: 15px;
	font-size: 15px;
	text-align: center;
}
table.table_05 thead th {
	background:#F9F9F9;
	color:#376da3;
	border-right:#E3E3E3 solid 1px;
	border-bottom:#E3E3E3 solid 1px;
}
table.table_05 thead th:last-child {
	border-right:none;
}
table.table_05 tbody th {
	background:#F9F9F9;
	color:#376da3;
	border-bottom:#E3E3E3 solid 1px;
}
table.table_05 tbody td {
	border-left:#E3E3E3 solid 1px;
	border-bottom:#E3E3E3 solid 1px;
}

#mailform table.table_form th {
	text-align: right;
	border-right-width: 4px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: dotted;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	font-size: 14px;
	font-weight: normal;
	padding: 20px;
	background-color: #F9F9F9;
}
#mailform table.table_form th p {
	font-size: 10px;
	line-height: 14px;
	color: #999;
	margin: 0px;
	padding: 0px;
}
span.required {
	display: inline-block;
	margin-left: 5px;
	color: #FFF;
	background-color: #996666;
	font-size: 12px;
	line-height: 24px;
	padding-right: 5px;
	padding-left: 5px;
}
#mailform table.table_form td {
	padding: 20px;
	background-color: #FFF;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	border-bottom-width: 1px;
	font-size: 14px;
}
form input.form_btn {
	background-color: #365e00;
	color: #FFF;
	padding-top: 10px;
	padding-right: 25px;
	padding-bottom: 10px;
	padding-left: 25px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border: 3px solid #EEE;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
	font-size: 18px;
	line-height: 24px;
}
form input.form_btn:hover {
	background-color: #FFF;
	color: #365e00;
	border-top-color: #365e00;
	border-right-color: #365e00;
	border-bottom-color: #365e00;
	border-left-color: #365e00;
	cursor: pointer;
}
form input.form_btn_gr {
	background-color: #555;
	color: #FFF;
	padding-top: 10px;
	padding-right: 25px;
	padding-bottom: 10px;
	padding-left: 25px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border: 3px solid #EEE;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
	font-size: 14px;
	line-height: 24px;
}
form input.form_btn_gr:hover {
	background-color: #FFF;
	color: #555;
	border-top-color: #555;
	border-right-color: #555;
	border-bottom-color: #555;
	border-left-color: #555;
	cursor: pointer;
}
input[type="text"], input[type="tel"]{
	padding: 5px;
	line-height: 1;
}
textarea {
caret-color: red;
}

@media screen and (min-width:1800px) {

.top_form {
	top: 30%;
	left: 15%;
}

}

@media screen and (min-width:1100px) {


/*
ヘッダー
-------------------------------------------*/
header {
	height: 200px;
}

header h1 {
	left: 20px;
	top: 15px;
}
.sp_menu,
.menu_btn,
.close_btn {
	display: none;
}

header .h_box {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 1000;
	width: 380px;
	padding-left: 10px;
}

header .h_btn {
	position: absolute;
	top: 55px;
	right: 10px;
	z-index: 1000;
}
header .h_btn a{
	width: 200px;
}

header .h_tel {
	position: absolute;
	top: 50px;
	right: 300px;
	font-size: 22px;
	z-index: 1000;
}
header .h_tel i {
	padding-right: 10px;
}
header .h_tel strong {
	font-size: 28px;
}
/*
PCグローバルナビ
-------------------------------------------*/
#g_navi {
	width: 100%;
	display: block;
	height: 80px;
	background-color: #00365E;
	background-color: rgba(0,15,44,0.9);
	position: absolute;
	z-index: 1000;
	left: 0px !important;
	bottom: 0px;
}
#g_navi.nav_fixed {
	position: fixed;
	top: 0px;
}
#g_navi ul.navi_base {
	height: 80px;
	width: 1100px;
	margin-right: auto;
	margin-left: auto;
	display: block;
}

#g_navi ul li{
	width: 157px;
	height: 80px;
	float: left;
	display: block;
}

#g_navi li a {
	width: 157px;
	height: 80px;
	display: table-cell;
	color: #FFFFFF;
	text-decoration: none;
	text-align: center;
	line-height: 22px;
	position: relative;
	vertical-align: middle;
}

#g_navi li a::before {
	display: block;
	width: 1px;
	height: 20px;
	position: absolute;
	top: 30px;
	left: 0px;
	background-color: rgba(255,255,255,0.6);
	content: '';
}
#g_navi li:last-child a::after {
	display: block;
	width: 1px;
	height: 20px;
	position: absolute;
	top: 30px;
	right: 0px;
	background-color: rgba(255,255,255,0.6);
	content: '';
}

#g_navi ul li a.ac_menu {
	position: relative;
}
#g_navi ul li a.ac_menu::after {
	font-size: 10px;
	display: block;
	height: 20px;
	width: 20px;
	content: "▼";
	text-align: center;
	line-height: 20px;
	position: absolute;
	bottom: 3px;
	left: 70px;
	color: #3987A4;
}

#g_navi li a:hover,
#g_navi ul li:hover > a {
	background-color: #00365E;
}

#g_navi ul li div {
	position: absolute;
	z-index: 2000;
	top: 80px;
	left: 0px;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
	width: 100%;
	height: 56px;
	background-color: #00365E;
}
#g_navi ul li ul{
  /*width: 870px;
  margin-left: auto;
  margin-right: auto;*/
  margin-left: 700px;
  height: 56px;
}
#g_navi ul li ul.long{
	margin-left: 300px;
	height: 56px;
}


#g_navi ul li ul li a{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	height: 56px;
}
#g_navi ul li ul li a:hover{
	opacity: 1.0;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	background-color: #115577;
}
#g_navi li li a::before,
#g_navi li li:last-child a::after {
	display: none;
}

#g_navi ul li:hover div{
  visibility: visible;
  opacity: 1;
}

#g_navi div.ac_list {
	display: block !important;
}

/*
メインコンテンツ
-------------------------------------------*/

.content {
	width: 1100px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 50px;
	padding-bottom: 30px;
}
.content-a {
	max-width: 95%;
	margin-left: 0;
	padding-top: 30px;
	padding-bottom: 30px;
}

.pankuzu ul {
	display: block;
	width: 1100px;
	margin-left: auto;
	margin-right: auto;
}
.table_02 th {
	text-align-last: justify;
	-moz-text-align-last: justify;
	padding: 20px 30px;
}
#Choice .table_02 th {
	padding: 20px 50px;
}

/*
フッター
-------------------------------------------*/
.footer_box  {
	width: 1100px;
	margin-right: auto;
	margin-left: auto;
}
.footer_box .box_in .foot_right {
	float: right;
	width: 300px;
}
.footer_box .box_in .foot_right h4 {
	font-size: 1.3em;
	margin-bottom: 10px;
}
.footer_box .box_in .foot_right h4 span {
	font-size: 0.8em;
}
.footer_box .box_in .foot_right p {
	font-size: 12px;
	margin-bottom: 20px;
	line-height: 30px;
}
.footer_box .box_in ul {
	display: block;
	float: left;
	width: 200px;
	margin-right: 30px;
}
}
/*-----（/min1100～）-----*/


@media screen and (max-width:1100px) {

/*ヘッダー
-------------------------------------------*/

header {
	height: 60px;
}

header h1 {
	left: 10px;
	top: 10px;
	width: 180px;
}

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

header #h_box_sp {
	position: fixed;
	width: 100%;
	height: 180px;
	top: 0px;
	left: 0px;
	overflow: auto;
	z-index: 3000;
	background-color: #00365E;
	background-color: rgba(0,15,44,0.9);
	box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding-right: 60px;
	display: none;
}

header .h_tel {
	clear: both;
	margin-left: auto;
	margin-right: auto;
	padding-top: 5px;
	padding-bottom: 15px;
	width: 350px;
	font-size: 22px;
	text-align: center;
}

header .h_tel strong {
	font-size: 28px;
}
header .h_btn a {
	clear: both;
	margin-left: auto;
	margin-right: auto;
	padding-top: 5px;
	padding-bottom: 5px;
	width: 500px;
}

header .h_btn a::after {
	line-height: 36px;
}


header .h_box .h_list li a {
	font-size: 12px;
	padding-left: 10px;
	padding-right: 10px;
	margin-top: 10px;
}

header .h_box ul.h_lang {
	margin-top: 10px;
	margin-bottom: 10px;
}

/*
メニューボタン
-------------------------------------------*/

.menu_btn {
	display: block;
	height: 40px;
	width: 40px;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	position: fixed;
	z-index: 5000;
	top: 5px;
	right: 5px;
	background-color: rgba(255,255,255,0.7);
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	font-family: "メイリオ", Meiryo, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "ＭＳ Ｐゴシック", "MS PGothic";
}

.menu_btn::after {
	content: "MENU";
	display: block;
	height: 10px;
	width: 40px;
	font-size: 9px;
	letter-spacing: 1px;
	position: absolute;
	left: 0px;
	bottom: 4px;
	text-align: center;
	color: #003584;
}

.menu_btn.opened::after {
	content: "CLOSE";
	color: #FFF;
	font-size: 8px;
	bottom: 2px;
}

.menu_btn:hover {
	cursor: pointer;
}

.menu_btn.opened {
	background-color: rgba(0,0,0,0.2);
}

.menu_btn.opened span {
	background-color: #FFF;
}
.menu_btn span {
	width: 28px;
	height: 2px;
	display: block;
	position: absolute;
	left: 50%;
	top: 36%;
	margin-left: -14px;
	background-color: #003584;
}
.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);    
  }
.menu_btn span.bottom {
    transform: translateY(8px);
	-webkit-transform: translateY(8px);  
    -moz-transform: translateY(8px);    
}


.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.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);    
}

/*
グローバルナビmax-width:1100px
-------------------------------------------*/
#g_navi {
	position: fixed;
	width: 70%;
	height: calc(100% - 170px);
	top: 180px;
	left: 30%;
	overflow: auto;
	z-index: 3000;
	background-color: #00365E;
	opacity: 0.95;
	filter: alpha(opacity=95);
	-ms-filter: "alpha( opacity=95 )";
	box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 7px 0px;
	display: none;
	overflow-y: scroll;
}

#g_navi ul {
	display: block;
	margin: 0px;
	padding: 0px;
	clear: both;
}

#g_navi ul li:first-child a {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #13476F;
}
#g_navi ul li a {
	color: #FFFFFF;
	text-decoration: none;
	display: block;
	padding-top: 16px;
	padding-right: 30px;
	padding-bottom: 14px;
	padding-left: 15px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #13476F;
	background-color: #00365E;
	background-image: url(img/li_sp.png);
	background-repeat: no-repeat;
	background-position: right center;
	line-height: 22px;
	vertical-align: middle;
}

#g_navi ul li a:hover {
	background-color: #005177;
}

.fixed {
	overflow: hidden;
}

/*
アコーディオンmax-width:1100px
--------------------------------------------------*/


#g_navi ul li a.ac_menu {
	position: relative;
	background-image: none;
}
#g_navi ul li a.ac_menu::after {
	font-size: 11px;
	display: block;
	height: 20px;
	width: 20px;
	content: "▼";
	text-align: center;
	line-height: 20px;
	position: absolute;
	top: 16px;
	right: 10px;
	color: #C1E2F2;
}
#g_navi ul li a.ac_menu.active {
	background-color: #005177;
	border-bottom-color: #006A9D;
}
#g_navi ul li a.ac_menu.active::after {
	content: "▲";
}
#g_navi div.ac_list {
	display: none;
}

#g_navi ul li ul li a {
	padding-left: 30px;
	background-color: #005177;
	border-bottom-color: #00699B;
}
#g_navi ul li ul li a:hover {
	background-color: #00699B;
}

/*
メニューシャドウ max-width:1100px
-------------------------------------------*/
.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;
}

/*
メインコンテンツmax-width:1100px
-------------------------------------------*/
.content_grid {
	gap: 15px;
}
.content {
	width: 90%;
	margin: 0 auto;
	padding-top: 10px;
	padding-bottom: 10px;
}
.content-a {
	width: 95%;
	margin: 0 auto;
	padding-top: 10px;
	padding-bottom: 10px;
}

.content p, .content-a p {
	margin-right: 15px;
	margin-left: 15px;
}

.news {
	margin-right: 10px;
	margin-left: 10px;
}

.cont_list {
	padding-top: 10px;
	padding-right: 10px;
	padding-left: 10px;
}


/*
トップフォーム max-width:1100px
-------------------------------------------*/
.top_catch {
	left: 400px;
}
.top_catch img {
	width: 500px;
}

.top_form {
	position: absolute;
	top: 80px;
	left: 15px;
	width: 380px;
	height: 320px;
}

.top_img .top_form h2 {
	font-size: 18px;
	margin-bottom: 15px;
	padding-top: 8px;
}

.top_img .top_form dl {
	height: 50px;
}

.top_img .top_form dl dt {
	font-size: 14px;
	padding-top: 10px;
	padding-bottom: 10px;
}
.top_img .top_form dl dd {
	padding-top: 5px;
	padding-bottom: 5px;
}

.top_img .top_form form dl dd select,
.top_img .top_form form dl dd input {
	font-size: 14px;
	line-height: 20px;
}

.top_img .top_form form .form_btn input {
	min-width: 180px;
	font-size: 16px;
	line-height: 20px;
}
.top-maruoyama {/*トップ丸尾山写真*/
	background: url(img/top_maruoyama.png) no-repeat 93% 3px / 53%;
}
p.press {/*トップ見出し文*/
	margin-top: 15px!important;
}

.chart ul li {
	width: 31%;
}
.service ul li,
.staff ul li {
	width: 25%;
}

.chart ul li a .mask
.service ul li a .mask {
	width: 150px;
	height: 150px;
}

/*
フッターmax-width:1100px
-------------------------------------------*/
.footer_box .box_in {
	width: 96%;
	margin-right: auto;
	margin-left: auto;
}
.footer_box .box_in .foot_right {
	float: right;
	width: 24%;
}
.footer_box .box_in .foot_right p {
	font-size: 12px;
	margin-bottom: 20px;
}
.footer_box .box_in ul {
	display: block;
	float: left;
	width: 24%;
	padding-right: 5px;
}
#to_top {
	bottom: 10px;
	right: 10px;
}

}
/*-----（/～1100）-----*/

@media (768px <= width <= 1000px) {
iframe {
	float: left;
}
.side_cont {
	float: right;
}
}
@media screen and (max-width:1000px) {
#pc{
	display:none;
}
#sp{
	display:block;
	margin: 0 auto;
}
.content_grid {
	grid-template-areas:
	"main_grid_a"
	"main_grid_b"
	"side_grid";
	grid-template-columns: 1fr;
	grid-template-rows: auto auto auto; //3行
	place-content: center;
	place-items: center;
}
.side_grid {
	justify-self: center;
	position: initial;
	width: 100%;
}
.side_cont {
	width: 330px;
}
#side_menu, .side_link, .side_purple, .side_white, .side_contact {
	width: 310px;
}
h4.title_01:after {
	width: 70%;
}
.even{
	margin-left: 100px;
}
.cont_list .list_box {
	width: 48%;
}
}

@media screen and (max-width:760px) {
img {
	max-width: 100%;
	height: auto;
	width /***/: auto;
	margin-left: auto;
	margin-right: auto;
}
header h1 {
	left: 5px;
	top: 5px;
}

.top_img {
	min-height: 360px;
}

/*
トップフォーム   max-width:760px
-------------------------------------------*/
.top_catch {
	display: none;
}
.top_form {
	top: 70px;
	left: 15%;
	width: 70%;
	height: 260px;
}

.top_img .top_form h2 {
	font-size: 16px;
	margin-bottom: 10px;
	padding-top: 5px;
}

.top_img .top_form dl {
	height: 40px;
}

.top_img .top_form dl dt {
	font-size: 12px;
	padding-top: 5px;
	padding-bottom: 5px;
	width: 26%;
}
.top_img .top_form dl dd {
	padding-top: 2px;
	padding-bottom: 2px;
	width: 64%;
}

.top_img .top_form form dl dd select,
.top_img .top_form form dl dd input {
	font-size: 12px;
	line-height: 18px;
}

.top_img .top_form form .form_btn {
	padding-top: 10px;
	padding-bottom: 10px;
}

.top_img .top_form form .form_btn input {
	font-size: 14px;
}
.top-maruoyama {/*トップ丸尾山写真*/
	background: no-repeat center 10px / 90% url(img/top_maruoyama.png) ;
}
p.press {/*トップ見出し文*/
	margin-top: 200px!important;
	font-size: 1em!important;
}

.chart ul li,
.service ul li,
.staff ul li {
	width: 50%;
}
.chart ul li a .mask {
	width: 160px;
	height: 160px;
}
.service ul li a .mask {
	width: 180px;
	height: 180px;
}

/*
テーブル  max-width:760px
-------------------------------------------*/

table.table_01 th,      /*ご注文について、 参考価格（天然砥石の選び方）*/
table.table_01 td,
.content table.table_form th,
.content table.table_form td {
	display: block;
	padding: 10px 20px;
}
table.table_01 th, #Choice .table_01 th {
	width: 100%;
}
table.table_01 li {
	text-indent: -4.62em;
	padding-left: 4.62em;
}

.table_04 tr {    /*送料*/
	display: block;
	float: left;
}
.table_04 tr td, 
.table_04 tr th {
	display: block;
	padding: 8px 0;
	height: 40px;
	font-size: 15px;
}
.table_04 tr td:nth-child(5) , 
.table_04 tr th:nth-child(5)  {
	height: 60px;
}
.table_04 tr td:nth-child(5) {
	padding-top: 15px;
}
.table_04 thead {
	display: block;
	float: left;
	width: 50%;
}
.table_04 thead tr {
	width: 100%;
}
.table_04 tbody {
	display: block;
	float: left;
	width: 50%;
}
.table_04 tbody tr {
	width: 100%;
}
.table_04 th {
	border-bottom: solid 1px #ccc;
}
.table_04 td {
	border-right: none;
}
.table_04 th:last-child {
    border-right: solid 1px #ccc;
}
.table_04 tbody td:last-child {
    border-bottom: solid 1px #ccc;
}
table.table_05 thead {
	display:none;
}
.table_05 th,     /*砥石の規格*/
.table_05 td{
	border-left:none;
	border-right:none;
}
table.table_05 tbody th, table.table_05 tbody td {
	display:block;
	border-left:none;
	border-right:none;
}
table.table_05 tbody th {
	padding: 15px 0;
}
table.table_05 tbody td {
	line-height: 1.0em;
}
table.table_05 tbody td::before {
	content: attr(label);
	float: left;
	clear:both;
	font-weight:bold;
}

.content table.table_form th,
.content table.table_form td {
	text-align: center !important;
}

.content table.table_form th {
	border-right: none !important;
}

/*
フッター max-width:760px
-------------------------------------------*/
.footer_box .box_in .foot_right {
	float: none;
	clear: both;
	width: 100%;
	text-align: center;
	margin-bottom: 0px;
	padding-top: 20px;
}
.footer_box .box_in .foot_right p {
	line-height: 26px;
	margin-bottom: 0px;
}
.footer_box .box_in ul {
	width: 33%;
}
.footer_box .box_in ul.fs09e li a {
	font-size: 0.9em;
}
.footer_box .box_in ul li a {
	letter-spacing: -2px;
}
.fs12v{
	font-size: 13px!important;
}
img.foot_logo {
	width: 150px;
}

}
/*-----（/～760）-----*/

@media screen and (max-width:560px) {

header .h_box ul.h_lang {
	float: left;
	margin-left: 15px;
	margin-bottom: 10px;
}

header .h_btn a {
	float: left;
	margin-left: 13px;
	padding-top: 0px;
	padding-bottom: 0px;
	width: 280px;
	background-position: 240px center;
}

header .h_btn a::after {
	line-height: 26px;
}

h2 {
	font-size: 22px;
	line-height: 21px;
}

h2 a.btn_list {
	font-size: 14px;
	line-height: 26px;
	width: 90px;
	top: 5px;
}

h2 a.btn_list::before {
	line-height: 26px;
}
.content h4.title_01:after {
	width: 100%;
}
.top_form {
	left: 5%;
	width: 90%;
}
/*----特別告知の三角印----------*/
ul.info {
	margin: 20px 0;
}

.cont_list .list_box {
	width: 98%;
}


/* 蔵入り砥石　スマホ時小さい画像を横幅いっぱい*/
img.adj {
	width: 94vw;
    margin-left: calc(-50vw + 50%);
	padding-left: 20px;
    max-width: none;
    height: auto;
}
/*
砥取家について
-----------------------------------------*/
.brand_grid {
grid-auto-columns: auto;
	gap: 5px;
	grid-template-rows: 500px auto;
}
.brand-txt {
	grid-column: 1 / 3;
	background: url(img/about/about3.png) no-repeat 5px 110px / contain;
}
.brand-img {
	grid-columns: 1 / 3;
}

/*
帯（老舗表彰）部分
-------------------------------------------*/
.obi_shinise {
	margin-bottom: 20px;
}

.service ul li {
	padding: 0px;
}
.service ul li img {
	width: 140px;
}

.service ul li a .mask {
	width: 140px;
	height: 140px;
}
.g_map iframe {
	height: 300px;
}
textarea,
input {
	max-width: 360px;
}


}
/*-----（/～560）-----*/
@media screen and (max-width:480px) {

p.press {/*トップ見出し文*/
	margin-top: 150px!important;
}
/*---------------------------------------
砥取家について
-----------------------------------------*/
.brand_grid {
grid-auto-columns: auto;
	grid-template-rows: 400px auto;
}
}
	
@media screen and (max-width:400px) {

header .h_box ul.h_lang {
	width: 110px;
}
header .h_box .h_lang li a {
	display: block;
	float: left;
	font-size: 14px;
	line-height: 20px;
	color: #00365E;
	text-align: center;
	text-decoration: none;
	width: 100px;
	margin-left: 4px;
	margin-top: 1px;
	padding: 1px 6px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
header .h_tel a {
	margin-left: 50px;
}

header .h_btn a {
	width: 180px;
	margin-left: 100px;
}
.news ul li a {
	font-size: 12px;
}

.top_form {
	left: 2%;
	width: 96%;
}

.top_img .top_form dl dt {
	width: 20%;
}
.top_img .top_form dl dd {
	width: 70%;
}
.service ul li a .mask {
	width: 150px;
	height: 150px;
}
textarea,
input {
	max-width: 280px;
}


}
/*-----（/～400）-----*/


/*
スライドショー
---------------------------------------------------------*/
.top_img {
	height: auto;
	width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: hidden;
}
@media (max-width: 1280px) {
.top_img {
	height: auto;
}
}
.top_img img.img_base {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}
@media (max-width: 680px) {
.top_img img.img_base {
	min-height: 360px;
}
}
.top_img img.img01,
.top_img img.img02,
.top_img img.img03 {
	animation-name: album;
	-webkit-animation-name: album;
	animation-duration: 15s;
	-webkit-animation-duration: 15s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	opacity: 0;
	display: block;
	width: 100%;
	min-width: 760px;
	position: absolute;
	top: 0;
	right: 0;
}

.top_img img.img02 {
	animation-delay:5s;
	-webkit-animation-delay:5s;
}

.top_img img.img03 {
	animation-delay:10s;
	-webkit-animation-delay: 10s;
}

@keyframes album {
	0% {
		opacity: 0;
-webkit-filter: blur(20px);
-moz-filter: blur(20px);
-ms-filter: blur(20px);
filter: blur(20px);
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
	}
	
	10% {
		opacity: 1;
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
	}

	34% {
		opacity: 1;
-webkit-transform: scale(1.0);
-moz-transform: scale(1.0);
-o-transform: scale(1.0);
-ms-transform: scale(1.0);
transform: scale(1.0);
	}
	44% {
		opacity: 0;
	}
}

@-webkit-keyframes album {
	0% {
		opacity: 0;
-webkit-filter: blur(20px);
-moz-filter: blur(20px);
-ms-filter: blur(20px);
filter: blur(20px);
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
	}
	
	10% {
		opacity: 1;
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
	}

	34% {
		opacity: 1;
-webkit-transform: scale(1.0);
-moz-transform: scale(1.0);
-o-transform: scale(1.0);
-ms-transform: scale(1.0);
transform: scale(1.0);
	}
	44% {
		opacity: 0;
	}
}

/*
エフェクト
-------------------------------------------*/
.effect {
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
	transform: translateY(30px);
	-webkit-transform: translateY(30px);  
    -moz-transform: translateY(30px); 
	-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);    
}



/*鳥山追加1023 謹賀新年用CSS↓*/

.yearend {
	background: url(img/yearend.jpg) no-repeat;
	padding: 20px 20px 5px;
	color: #736d00;
	background-size:cover;
}
.yearend li {
	margin: 0 0 10px 40px;
	color: #730000;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.newyear {
	background: url(img/newyear.png) no-repeat;
	padding: 20px;
	background-size:cover;

}
.kinga{
	color:#FF0000;
	position: relative;
	top: 10px;
	text-align:center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: bold;
	font-size: 50px;
	letter-spacing: 0.5em;
	line-height: 80px;
	margin-bottom: 30px;
}
.newyear p {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	text-shadow: #a33737  1px 1px 2px, #a33737  -1px 1px 2px, #a33737  1px -1px 2px, #a33737  -1px -1px 2px;
	color: #fff ;
		text-align:center;
	font-size: 1.1em;
}



@media screen and (max-width:1100px) {
.yearend {
	background: url(img/yearend.jpg) no-repeat;
	color: #736d00;
	background-size:cover;
	padding: 5px;
}

.yearend li {
	margin: 0 0 30px 0px;
	text-align:center;
		}
		

.newyear {
	background: url(img/newyear.png) no-repeat;
	background-size:cover;
	padding: 5px;
}	
	
.kinga{
	font-size: 40px;
}


}


/*鳥山追加1023 謹賀新年用CSS↑*/