@charset "utf-8";

/*ここでは
	荒井屋とは
	などを記述します
*/

.about{}
#contents{ font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","Sawarabi Mincho","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;}
#main_img{ background: url(../img/main_img.jpg) no-repeat scroll center center;}

.read_area .content_box{ position: relative; min-height: 500px; max-width: 1000px;}
.read_area .read{ width: 100%; margin: 0 auto; position: absolute; top:0; background: url(../img/flower.png) no-repeat left bottom; padding-top: 3%; z-index: 1;}
.read_area .read::after { clear: both; content: " "; display: block;}
.read_area .read img{ display: block; float: right; padding-right: 8%;}

.okami{ padding: 12% 0 0%;}
.okami .wrap{ max-width: 86%; margin: 0 auto;}
.okami >div{ padding-bottom: 5%;}
.okami img{ max-height: 550px;}
.okami .r_area{ float: right; width: 54%; overflow: hidden;}
.okami .photo{ float: right; width: 85%; position: relative;}
.okami .photo{ background: url(../img/okami.jpg) no-repeat center top / cover;}
.okami .title{ float: left; width: 15%; text-align: center;}

.okami .l_area{ float: left; width: 46%;}
.okami .l_area img{ float: right;}

.chef{ padding: 0% 0 2%; background: url(../../shared/img/patten_asanoha.png) no-repeat right bottom;}
.chef .wrap{ max-width: 86%; margin: 0 auto;}
.chef img{ max-height: 550px;}
.chef .l_area{ float: left; width: 54%; overflow: hidden;}
.chef .photo{ float: right; width: 85%; position: relative; background: url(../img/chef.jpg) no-repeat center top / cover;}
.chef .title{ float: right; width: 15%; text-align: center;}
.chef .r_area{ float: left; width: 46%;}
.chef .r_area img{ float: left;}


.title img{ max-height: 330px;}


/*百二十年史*/
.year-history{}
.year-history #main_img{ background: url(../year-history/img/main_img.jpg) no-repeat scroll center center;}
.year-history .content_box{ max-width: 980px;}
.year-history .content_box .t_center{ padding-bottom: 30px !important;}
.year-history .responsive_table{ float: left; max-width: 81%;}
.year-history .responsive_table table{}
.year-history .responsive_table tr{ margin-bottom: 0.3em; display: block;}
.year-history .responsive_table th{ color: #B26A1F; min-width: 13em; padding: 10px 0.5em  10px 0em; font-size: 12px;}
.year-history .responsive_table th b{ font-size: 17px; display: inline-block; padding-right: 7px;}
.year-history .responsive_table td{ padding: 10px 0.3em;}

.year-history .r_box{ float: right; max-width: 17%;}
.year-history .r_box img{ max-width: 100%; padding-bottom: 15%;}



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

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

.okami .wrap{ max-width: 90%;}
.chef .wrap{ max-width: 90%;}

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

.okami .wrap{ max-width: 100%;}
.chef .wrap{ max-width: 100%;}

/*百二十年史*/
.year-history .content_box{ max-width: 94%;}

}
@media screen and (max-width: 681px) {
#main_img{ background: url(../img/main_img.jpg) no-repeat scroll center center / auto 110%;}

.read_area .content_box{ max-width: 93%; margin: 0 auto; min-height: auto;}
.read_area .read{ position: relative; background: url(../img/flower.png) no-repeat right bottom / 60px auto;}
.read_area .read img{ float: none; padding: 2% 0 5%;}

.okami{ padding: 8% 0 0;}
.okami img{ max-height: 260px;}
.okami .r_area{ float: none; width: 100%; margin-bottom: 5%;}
.okami .title{ width: 20%;}
.okami .photo{ min-height: 260px; width: 80%;}
.okami .l_area{ float: none; width: 90%; margin: 0 auto;}


.chef{ background: url(../../shared/img/patten_asanoha.png) no-repeat right bottom / 50% auto;}
.chef img{ max-height: 260px;}
.chef .l_area{ float: none; width: 100%; margin-bottom: 5%;}
.chef .photo{ min-height: 260px; width: 80%;}
.chef .title{ width: 20%; text-align: center;}
.chef .r_area{ float: none; width: 90%; margin: 0 auto;}

/*百二十年史*/
.year-history #main_img{ background: url(../year-history/img/main_img.jpg) no-repeat scroll center center / auto 110%;}
.year-history .content_box{ max-width: 90%;}

.year-history .responsive_table,.year-history .r_box{ float: none; max-width: 100%;}
.year-history .r_box{ text-align: center; overflow: hidden; padding-top: 20px;}
.year-history .r_box img{ display: block; float: left; width: 46%; margin: 0 2% 5%; padding: 0;}
}

