@charset "utf-8";

/*--1rem=16px 960/12grid(1col 8.3333%)--*/

html {
font-size: 87.5%;/*14px*/
line-height: 3.4285;/*48px*/
font-family: 'Times New Roman', 'Yu Mincho', 'Hiragino Mincho Pro', 'MS Mincho', 'Yu Gothic', 'Meiryo', 'MS PGothic', sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
color: #3f3f3f;
}
article, header, nav, section, img {
display: block;
}
address {
font-style: normal;
}
h1 br,h2 br,h3 br,p br {
display:none;
}
/* ----- contents ----- */

.contents {
width: 83.333%;
margin: 1.5rem auto;
}
.float_r, .float_l {
margin: 0 auto;
}
/* ----- img ----- */

img {
max-width: 100%;
vertical-align: middle;
}

a img {
-webkit-transition: opacity 1s ease-out;
-moz-transition: opacity 1s ease-out;
-ms-transition: opacity 1s ease-out;
transition: opacity 1s ease-out;
}

a:hover img {
opacity: .5;
-webkit-opacity: .5;
-moz-opacity: .5;
filter: alpha(opacity=50);/* IE lt 8 */
-ms-filter: "alpha(opacity=50)"; /* IE 8 */
}

.center img {
display: block;
margin: 0 auto;
}

.clearfix:after {
display: block;
clear: both;
content: '';
}

/* ----- ico ----- */

.sankaku {
width: 0;
border: 48px solid transparent;
border-top: 48px solid #6f4900;
margin: 0 auto;
}

.box_dai,.box, .heart, .book,.fb,.mark,.jumoku,.sankotu {
display: inline-block;
}

.box,.heart,.book,.fb,.mark {
width:1em;
}

.box_dai,.jumoku,.sankotu  {
width:48px;
height:48px;
padding-right:0.5em;
vertical-align: middle;
}

.box_dai {
background: url(../images/ico/box_dai.svg) center bottom  no-repeat;
}
.box {
background: url(../images/ico/box.svg) center bottom no-repeat;
}
.heart {
background: url(../images/ico/heart.svg) center bottom no-repeat;
}
.book {
background: url(../images/ico/book.svg) center bottom no-repeat;
}
.fb {
background: url(../images/ico/fb.svg) center bottom no-repeat;
}
.mark {
background: url(../images/ico/mark.svg) center bottom no-repeat;
}
.jumoku {
background: url(../images/ico/jumoku.svg) center bottom no-repeat;
}
.sankotu {
background: url(../images/ico/sankotu.svg) center bottom no-repeat;
}

/* ----- list ----- */

ul, ol, dl {
margin: 0;
padding: 0;
}
li, dt, dd {
margin: 0;
list-style: none;
}
dt {
font-weight: bolder;
}

/* ----- font ----- */

h1, h2, h3, h4, h5, h6 {
color: #6f4900;
}
h1, h2 {
margin: 0 0 3rem;
font-family: 'Times New Roman', 'Yu Mincho', 'Hiragino Mincho Pro', 'MS Mincho', sans-serif;
}
h3, h4, h5, h6, p {
margin: 0 0 1.5rem;
}
h1 {
font-size: 3rem;
line-height: 2;
}
h2 {
font-size: 2rem;
line-height: 1.5;
}
h3 {
font-size: 1.5rem;
line-height: 2;
}
h4 {
font-size: 1rem;
line-height: 3;
}
h5 {
 font-size: .75rem;
line-height: 2;/*24px*/
}
h6 {
 font-size: .5rem;
line-height: 3;/*24px*/
}
a {
color: #6f4900;
text-decoration: none;
background: transparent;
}
a:hover {
color: #000;
outline: 0;
}
strong {
font-weight: bolder;
}
small, .small {
font-size: 75%;
}
.big {
font-size: 150%;
}
.right {
text-align: right;
}
.center {
text-align: center;
}

/* ----selection-----*/

::selection {
background: #e7e7e7;
}

::-moz-selection {
background: #e7e7e7;
}
/* ----- bg ----- */

.bg_beige {
background: #f3f0dc;
}
.bg_green {
background-color: #035421;
}
.bg_blue,.bg_usblue {
background-color: #35466d;
}
.bg_brown {
background-color: #672200;
}
.bg_dbrown {
background-color: #6f4900;
}
.bg_brown,.bg_dbrown h2,
.bg_dbrown,
.bg_green, .bg_blue,
.bg_brown a, .bg_dbrown a, .bg_green a, .bg_blue a {
color: #fff;
}
.bg_dbrown h2 {
margin:0;
}
.bg_beige,bg_dbrown,.bg_brown a, .bg_green a, .bg_blue a {
padding:1.5rem 0;
}

.bg_usblue {
opacity: .75;
-webkit-opacity: .75;
-moz-opacity: .75;
filter: alpha(opacity=75);/* IE lt 8 */
-ms-filter: "alpha(opacity=75)"; /* IE 8 */
}

/* ----- line ----- */

.line, .line_sita {
height: 48px;
}
.line {
background: url(../images/line.png) repeat-x;
}
.line_sita {
background: url(../images/line_sita.png) repeat-x;
}

/* ----- mail ----- */

input,input[type="submit"] ,input[type="reset"]{
border:0;
font-size: 150%;
border:solid 1px #ccc;
padding:0.5em 1em;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}

input{
width: 100%;
-moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
-webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
}

input[type="submit"] ,input[type="reset"]{
background:#6f4900;
color:#fff;
}

/* ----- drawer_menu ----- */

#logo, #f_logo {
margin: 1.5rem auto;
}
#drawer_menu {
width: 50%;
height: 100%;
overflow: auto;
position: fixed;
right: -50%;
top: 0;
z-index: 9999;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
background: #fff;
}
#drawer_menu li {
border-bottom: 1px solid #e7e7e7;
}
#drawer_menu li ul li{
list-style:circle inside;
}
#drawer_menu li img, #main_menu {
display: none;
}
#drawer_menu li a {
padding: 0 8.3333%;
display: block;
color: #3f3f3f;
}
#drawer_menu li a:hover {
background: #f3f0dc;
color: #6f4900;
}
#drawer_menu.block {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
#drawer.block:not(:target) {
right: 0\9;
}
#drawer_menu .close {
display: block;
position: relative;
color: #000;
background: #e7e7e7;
padding: 1.5rem 8.3333%;
}
#drawer_menu .close:hover {
cursor: pointer;
color: #fff;
background: #404040;
}
#drawer_menu .close:after {
content: "";
width: 100%;
height: 100%;
position: absolute;
top: 0;
right: 0;
}
#drawer_menu_overlay {
width: 100%;
height: 100%;
position: fixed;
right: 0;
top: 0;
z-index: -1;
transition: 0.3s;
background: rgba(0, 0, 0, 0.5);
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
}
#drawer_menu_overlay.block {
z-index: 3;
filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1;
}
#drawer_menu_overlay_android {
width: 100%;
height: 100%;
position: fixed;
right: 0;
top: 0;
display: none;
background: rgba(0, 0, 0, 0.5);
}
.bar {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 4px;
background: #e7e7e7;
-webkit-transition: all .5s;
transition: all .5s;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
}
.bar.middle {
top: 16px;
opacity: 1;
}
.bar.bottom {
top: 32px;
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
}
.menu_btn {
position: fixed;
z-index: 9999;
top: 1.5rem;
right: 4.16665%;
display: block;
width: 3rem;
height: 4.5rem;
cursor: pointer;
text-align: center;
}
.menu_btn_text {
font-size: 1rem;
line-height: 3;
font-weight: bold;
position: absolute;
bottom: -8px;
right: 0;
left: 0;
display: block;
visibility: visible;
margin: auto;
-webkit-transition: all .3s;
transition: all .3s;
opacity: 1;
color: #3f3f3f;
}
.menu_btn:hover {
background: #6f4900;
opacity: 1;
}
.menu_btn:hover .menu_btn_text {
color: #fff;
}
.menu_btn:hover .bar {
background: #fff;
}
#drawer_menu li i {
width: 26px;
height: 25px;
vertical-align: central;
}
/* ----- top ----- */

#top {
display: none;
}
#top_menu {
position: relative;
}
#top_menu li {
-webkit-backface-visibility: hidden;
position: absolute;
display: none;
width: 100%;
left: 0;
top: 0;
}
#top_menu li:first-child {
position: relative;
display: block;
float: left;
}
#top_menu img {
width: 100%;
}

#submenu {
text-align: center;
}

/* ----- top_waku ----- */

.waku{
border: 1px solid #6f4900;
}

.waku,.waku_r {
padding: 1.5rem 8.3333%;
}

.waku li,.waku_r li {
list-style: circle inside;
margin-bottom:1em;
}

.waku li:last-child,.waku_r li:last-child {
margin-bottom:0;
}

.l_merit,.l_demerit {
position: relative;
border-radius: 1em;
-moz-border-radius: 1em;
-webkit-border-radius: 1em;
width: 75%;
margin: 0 auto;

}

.l_merit h2,.l_demerit h2{
text-align:center;
}

.l_merit {
background: #fff;
}
.l_demerit {
display: none;
}

.l_merit img,.l_demerit img {
margin:0 auto;
}

/* ----- pack ----- */

#pack li {
width: 45%;
margin: 0.75rem 2.5%;
float: left;
text-align: center;
}
#pack li p {
margin: 0;
color:#6f4900;
}
#pack li img {
width: 100%;
}

/* ----- nagare ----- */

#nagare li {
margin: 0.75rem auto;
width:75%;
font-size:150%;
background: #fff;
color:#0f0f0f;
}

/* ----- footer ----- */

footer {
background: #e7e7e7;
padding: 1.5rem 0;
text-align: center;
}
footer li {
width: 50%;
float: left;
border-top: 1px solid #ccc;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
#drawer_menu.block_ie10 {
-webkit-transform: translate3d(-75%, 0, 0) !important;
transform: translate3d(-75%, 0, 0) !important;
}
}


@media screen and (min-width:768px) {
h1 br,h2 br,h3 br,p br {
display:block;
}
#bg01 {
background: url(../images/bg_01.jpg) right bottom no-repeat;
}
#bg02 {
background: url(../images/bg_02.jpg) right top no-repeat;
}
#bg03 {
background: url(../images/bg_03.jpg) right top no-repeat;
}
#bg04 {
height:288px;
background: url(../images/bg_04.jpg) right bottom no-repeat;
}

.t01 {
background: url(../images/t_01.jpg) center bottom no-repeat;
}
.t02 {
background: url(../images/t_02.jpg) center top no-repeat;
}
.t03 {
background: url(../images/t_03.jpg) center top no-repeat;
}
.t04 {
background: url(../images/t_04.jpg) center top no-repeat;
}
.t05 {
background: url(../images/t_05.jpg) center center no-repeat;
}

.t01,.t02,.t03,.t04,.t05,
#bg02,#bg03 {
-moz-background-size: cover;
background-size: cover;
}

/* ----- lound ----- */

.lound {
overflow: hidden;
}

/* ----- float ----- */
.float_r {
float: right;
margin-left: 3em;
}
.float_l {
float: left;
margin-right: 3em;
}
#logo {
padding: 0;
position: fixed;
left: 6.25%;
z-index: 9999;
top: 0.75rem;
display: block;
}

#drawer_menu li ul,#drawer_menu .close, .bar, .menu_btn, .menu_btn_text {
display: none;
}
#drawer_menu {
position: fixed;
padding: 0;
right: 0;
height: 9rem;
transform: none;
opacity: 1;
z-index: 9998;
width: 100%;
background: url(../images/line.png) bottom repeat-x #FFF;
}
#drawer_menu ul {
width: 58.3333%;
position: absolute;
bottom: 1.75rem;
right: 4.16665%;
}
#drawer_menu li {
float: left;
margin: 0 2.0833%;
border-bottom: none;
}
#drawer_menu li a {
color: #6f4900;
padding: 0;
}
#drawer_menu li a:hover {
background: #fff;
color: #0f0f0f;
}
#main_menu {
display: block;
background: #e7e7e7;
}
#main_menu li {
width: 20%;
margin: 0.75rem 2.5%;
float: left;
text-align: center;
}
#main_menu li p {
margin: 0;
}
#main_menu li img {
width: 100%;
padding: 1%;
border: 1px solid #ccc;
background: #fff;
}
#top {
display: block;
position: relative;
margin-top: 8rem;
height: 360px;
color: #fff;
text-shadow: 1px 2px 1px #000;
}
#top_word {
width: 50%;
left: 6.25%;
top: 3rem;
position: absolute;
}
#top_word h1 {
margin: 0;
color: #fff;
}
#submenu {
font-size: 150%;
font-weight:bold;
}
#submenu li {
width: 50%;
float: left;
}

#submenu li a{
display:block;
}
#submenu li a:hover{background:#0f0f0f;}

/* ----- mail ----- */

input{
width:100%;
margin-bottom:1.5rem;
}
input[type="submit"] ,input[type="reset"]{
width:25%;
}

.contents dt {
float: left;
font-size: 112.5%;
width: 25%;
}
.contents dd {
float: left;
width: 75%;
}

/* ----- merit ----- */

.l_merit, .l_demerit {
margin-bottom: 3rem;
}

.l_demerit {
display: block;
color: #fff;
background: #6f4900;
}

.l_merit img,.l_demerit img {
position: absolute;
top: 1.5rem;
right: 8.3333%;
margin:0;
}

.l_merit h2,.l_demerit h2{
text-align:left;
}

.l_demerit h2, .l_demerit h3 {
color: #fff;
}

/* ----- nagare ----- */

#nagare li {
margin: 0.75rem 4.16665%;
width:25%;
float:left;
}
}

@media screen and (min-width:960px) {
html {
font-size: 125%;/*20px*/
line-height: 2.4;
}

#top {
display: block;
position: relative;
margin-top: 7.5rem;
height: 480px;
color: #fff;
text-shadow: 1px 2px 1px #000;
}

#top_word {
left: 6.25%;
top: 3rem;
position: absolute;
}
.bg_beige{
padding:3rem 0;
}

.l_merit img,.l_demerit img {
top: -1.5rem;
}
#drawer_menu {
height: 7.5rem;
}
#drawer_menu ul {
bottom: 1rem;
}
}

@media screen and (min-width:1024px) {
.waku,.waku_r {
padding: 1.5rem 4.16665%;
}

.l_merit, .l_demerit {
float: left;
width: 20.83325%;
margin: 0 2.083325%;
}
.l_merit img,.l_demerit img {
right: -1rem;
}
#bg01 {
background: url(../images/bg_01x.jpg) right bottom no-repeat;
}
#bg02 {
background: url(../images/bg_02x.jpg) right top no-repeat;
}
#bg03 {
background: url(../images/bg_03x.jpg) right top no-repeat;
}
.t01,.t02,.t03,.t04,.t05,
#bg02,#bg03 {
-moz-background-size: cover;
background-size: cover;
}
}

@media screen and (min-width:1280px) {
html {
font-size: 150%;/*24px*/
line-height: 2;
}
.contents {
width: 66.6664%;
}

#top_menu img {
margin: 0 auto;
width: auto;
}

#top_word {
left: 15%;
top: 4.5rem;
}

#drawer_menu ul {
bottom: 1.5rem;
}
.l_merit img,.l_demerit img {
right: 12.5%;
top:3.125%;
}
}

@media screen and (min-width:1600px) {
#logo {
bottom: 3rem;
left: 12.5%;
}
#drawer_menu{
height: 7.5rem;
}
#drawer_menu ul{
bottom: 1.5rem;
}
#drawer_menu li {
padding: 0;
margin: 0 0 0 4.16665%;
}
#top_word {
width: 41.6667%;
}

.t01 {
background: url(../images/t_01x.jpg) no-repeat;
}
.t02 {
background: url(../images/t_02x.jpg) no-repeat;
}
.t03 {
background: url(../images/t_03x.jpg) no-repeat;
}
.t04 {
background: url(../images/t_04x.jpg) no-repeat;
}
.t05 {
background: url(../images/t_05x.jpg) no-repeat;
}
}

@media print {
header,#top,#main_menu,footer {
display: none;
}
}
