@charset "utf-8";
/* CSS Document */
#slimmenu{ display:none;}
#navArea{ display:none;}
.pcno { display:none;}
img { max-width:100%;}
#navArea{ display:none;}
/*▼ 初期化 ▼*/
body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, ul, li, blockquote, th, td, tr, img { padding:0px; margin:0px; font-size:16px; line-height:1.5em; letter-spacing:1px; color:#030303;-webkit-text-size-adjust:100%; font-weight:400; font-family:'futura-pt', 'Noto Sans JP', "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;}
table { border-collapse:collapse; }
ul, li { list-style:none; }
h1, h2, h3, h4, h5, h6, .more{ padding:0px; margin:0px; font-size:100%; font-weight:normal; font-family:'Zen Old Mincho', serif;}
a { overflow:hidden; outline:none; }
img { border:none; vertical-align:bottom; }
table td { border:none; vertical-align:top; }
.text99 { text-indent:-9999px; }
a{-webkit-transition:0.5s; -moz-transition:0.5s; -ms-transition:0.5s; transition:0.5s; }
a:hover { text-decoration:none; }
a:hover { opacity:0.5; filter:alpha(opacity=50);-webkit-transition:0.5s; -moz-transition:0.5s; -ms-transition:0.5s; transition:0.5s; }
.kadomaru{-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
/*▲ 初期化 ▲*/
.mb30{ margin-bottom:30px;}
.mb50{ margin-bottom:50px;}


/*▼エリア・背景設定▼*/
body{ min-width:1024px; position:relative;}
#body-top{ overflow:hidden;}
h1{ text-indent:-9999px; height:0px;}


/*▼ヘッダー▼*/
#header { min-width:1150px; height:115px; position:fixed; top:0px; z-index:999; left:0; right:0; margin:auto; transition:.3s;}
#header #hmid{ overflow:hidden; padding:0 20px;}
#header #hmid .left{ float:left; padding-top:15px; margin-left:20px;}
#header #hmid .left a{ width:302px; height:80px; display:inline-block; text-decoration:none; transition:0.5s ease-out;}
#header #hmid .left img{ transition:0.5s ease-out;}
#header #hmid .right{ float:right; overflow:hidden;}

/*切り替え*/
#header.black { background:rgba(255,255,255,.3); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);}

/* ナビ */
#navi{ padding-top:10px; float:right; margin-right:30px;}
#navi ul{ text-align:center;}
#navi ul li { display:inline-block;padding:0 15px; font-size:16px; font-weight:500; letter-spacing:2px; vertical-align: middle; font-family:"Noto Serif JP", serif;}
#navi ul li a{ color:#2c2c2c; text-decoration:none; position:relative; display:inline-block; transition:0.5s ease-out;}

#navi ul li:first-child{ padding-left:0;}
#navi ul li:nth-child(5) a{ width:41px; height: 41px; transition:0.5s ease-out;}
#navi ul li:nth-child(5) a img{ transition:0.5s ease-out;}
#navi ul li:last-child{ font-size:13px; padding-right:0; letter-spacing:1px; position:relative; top:-1px;}
#navi ul li:last-child a{ background:#520a7c url(../images/common/ico-mail.png)center 30px no-repeat; width:100px; height: 100px; color:#fff; border-radius:50%; padding:53px 0 0; box-sizing:border-box;}
#navi ul li:last-child a:hover{ background:#fff url(../images/common/ico-mail-p.png)center 30px no-repeat !important; color: #520a7c !important; opacity:1;}



/*▼メインビジュアル▼*/
.mp{ display:none; background:#fef5e6; text-align: center; padding-top:115px;}
.mp .area-01{ width:1024px; height:200px; margin:auto; display:table;}
.mp .area-01 p { font-size:106px; font-weight:bold; color:#ffe8c1; display:table-cell; vertical-align:middle; font-family:'Zen Old Mincho', serif; position: relative;}
.mp .area-01 span{ font-size:32px; color:#2c2c2c; display:block; height:32px; line-height: 1em; position: absolute; left:0; right:0; top:0; bottom:0; margin:auto;}

	
/* オーバーレイ（フェードアウト用） */
#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #2c2c2c;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  transition: opacity 2s ease-in-out;
  min-width:1024px;
}

/* オーバーレイの中のコンテンツ（ロゴとキャッチコピー） */
.overlay-content {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.overlay-left, .overlay-right {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

.overlay-left img {
  max-width: 80%;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.overlay-right img{
  max-width: 80%;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}


/* メインビジュアル（最初から表示） */
#hmp {
  position: relative;
  background: url(../images/home/mp.png) center top no-repeat;
  background-size:cover;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 1; /* 最初から表示 */
}

/* メインビジュアル */
.mpleft, .mpright {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ロゴは最初から表示されているので opacity 指定は不要 */
.mpleft img {
  max-width: 80%;
}

/* 縦書きテキスト */
.mpright {
  max-width: 80%;
}




/*▼フッター▼*/
#footer { background:#fef5e6; border-top:1px solid #2c2c2c;}
#footer #fmid{ width:1024px; margin:auto; overflow:hidden; padding:70px 0 60px;}
#footer .left { float:left; text-align:left;}
#footer .left a.name{ display:inline-block; text-decoration:none; vertical-align:middle;}
#footer .left .p-01{ font-size:15px; margin:0 8px 5px 0;}
#footer .left .p-tel{ font-size:27px; font-weight:bold; display:inline-block; letter-spacing:normal; vertical-align:middle; font-family:'Zen Old Mincho', serif;}
#footer .left .p-tel a{ background:url(../images/common/ico-tel.png)left 0px no-repeat; text-decoration:none; color:#2c2c2c; padding-left:30px; background-size:25px auto;}
#footer .left .inst{ display:inline-block; vertical-align:middle; margin:0 0px 0 80px;}

#footer .right{ float:right; padding-top:15px;}
#footer .right ul{ display:inline-block; vertical-align: top;}
#footer .right ul:last-child{ margin-left: 50px;}
#footer .right ul li{ font-size:16px; font-weight:500; margin-bottom:10px; position:relative; padding-left:13px; position: relative;}
#footer .right ul li::before{ content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); border:4px solid transparent; border-left:6px solid #2c2c2c;}
#footer .right ul li a{ color:#2c2c2c; text-decoration:none; display:block;}
#footer .right ul:last-child li{ padding-left:22px;}
#footer .right ul:last-child li::before{ display:none;}
#footer .right ul:last-child li::after{ content:""; width:15px; height:1px; background:#2c2c2c; position: absolute; top:50%; left:0;}

#footer #tamonten { clear:both; text-align:center; font-size:10px; padding:10px 0;}
#footer #tamonten a { display:block; cursor:default; color:#2c2c2c; text-decoration:none; opacity:1; filter:alpha(opacity=100);}


.page-top {
	position:fixed;
    bottom:70px;
    right:60px;
	background-image:url(../images/common/totop.png);
	width:71px; height:71px; text-indent:-9999px;
    -ms-filter:"alpha(opacity=80)";
    -moz-opacity:0.8;
    -khtml-opacity:0.8;
    opacity:0.8;
	z-index:10;
	-webkit-transition:0s; -moz-transition:0s; -ms-transition:0s; transition:0s;}



/*▼エリア・共通設定▼*/
.box{ width:1100px; margin:auto; padding:70px 0;}
.bk-beige{ background:#fef5e6;}

.h2-01{ font-size:30px; font-weight:bold; color:#030303; -ms-writing-mode:tb-rl; writing-mode:vertical-rl; position: absolute; left:0; top:0;}
.h2-01 span{ font-size:16px; display:block; position:absolute; top:0; right:-35px;}

.h2-02{ font-size:30px; font-weight:bold; color:#030303; -ms-writing-mode:tb-rl; writing-mode:vertical-rl; position: absolute; right:0; top:0;}
.h2-02 span{ font-size:16px; display:block; line-height: 1.5em;}

.h2-03{ font-size:30px; font-weight:bold; color:#030303; text-align: center; margin-bottom: 50px;}
.h2-03 span{ font-size:18px; display:block; line-height: 1.5em; display: block;}


.more{ width:330px; text-align:center; margin:50px auto;}
.more a{ background:#fff; border:1px solid #2c2c2c; font-size:18px; font-weight:500; color:#2c2c2c; padding:25px 0; border-radius:50px; display:block; text-decoration:none; position:relative; font-family:'Zen Old Mincho', serif;}
.more a span{ font-size:10px; line-height:1em; display:inline-block; position:absolute; right:50px; top:48%;}
.more a:hover{ background:#2c2c2c; color:#fff; opacity:1;}


/*　メインカラム　*/
#mainbox{ width:100%; margin:auto;}
#main{ width:100%; margin:auto;}

/*　サイドカラム　*/
#mleft { width:300px; float:left; padding-bottom:50px;}

#mleft h2.h2-01{ font-size:16px; background:#c4acd0; color:#fff; padding:10px 10px; margin-bottom:0; text-align:left; position:relative;top:0; right:0;writing-mode:horizontal-tb;}
#mleft h2.h2-01 span{ display:inline-block; float:right; font-size:14px; letter-spacing:normal;font-family:'Zen Old Mincho', serif;position:relative; top:0; right:0;}

#mleft #sbox-02 { margin-bottom:30px;}
#mleft #sbox-02 a{ color:#000; text-decoration:none; display:block;}
#mleft #sbox-02 .entry{border-bottom:#999 dotted 1px;overflow:hidden; padding:10px 0px;}
#mleft #sbox-02 .entry img{ width:50px; height:60px;object-fit: cover; vertical-align:middle; margin-right:3px;}
#mleft #sbox-02 .entry .text{ width:235px; vertical-align:middle; display:inline-block;}
#mleft #sbox-02 .entry .text .p-01{ font-size:14px; font-weight:500;letter-spacing:normal; line-height:1.4em; margin-bottom:2px; font-family: 'Noto Sans JP', sans-serif;}
#mleft #sbox-02 .entry .text .p-02{ font-size:14px; text-align:right; letter-spacing:normal;}

#mleft #subguidebox{}
#mleft #subguidebox ul{ padding-top:5px;}
#mleft #subguidebox ul li a{ text-decoration:none; color:#333; display:inline-block; background:url(../images/common/snavi.png) left 4px  top 6px no-repeat; background-size:13px auto; padding:5px 0px 5px 25px; font-size:14px; letter-spacing:normal;}
#mleft #subguidebox ul li:last-child a{border-bottom: none;}
#mleft #subguidebox ul li a:hover{ background:url(../images/common/snavion.png) left 4px  top 6px no-repeat; background-size:13px auto; opacity:0.8; color:#834c9f;}
#mleft #subguidebox ul li a:hover{ -webkit-transform: translateX(3px); transform: translateX(3px);}


#mright{ width:700px; float:right;}
#mright h2.h2-01{ font-size:32px; margin-bottom:30px; text-align:left; border-bottom:2px dotted #ccc;}



/*----------  ホーム home  ----------*/
/*----------  ホーム home  ----------*/
/*----------  ホーム home  ----------*/
#home #box-01{ padding:250px 0 120px; position:relative;}
#home #box-01 .area-01{ width:1300px; margin:auto; overflow:hidden;}
#home #box-01 .area-01 .tb{ width:42%; float:right; padding-top:50px;}
#home #box-01 .area-01 .tb h2{ font-size:32px; font-weight:500; color:#2c2c2c; line-height: 2.3em; margin-bottom:60px; font-family:'Zen Old Mincho', serif;}
#home #box-01 .area-01 .tb p { font-size:16px; color:#2c2c2c; line-height:2.8em; font-family:'Zen Old Mincho', serif;}
#home #box-01 .area-01 .tb .more{ float: right; margin-top: 70px;}
#home #box-01:after{ content: "";display: block; width: 100%; height: 351px; background-image: url(../images/home/bk-top.png); background-size: 100% 100%; position: absolute; bottom: -350px; left: 0;}
#home #box-01:before{ content: ""; display: block; width: 100%; height: 149px; background-image: url(../images/home/mp-bottom.png); background-size:; background-repeat:no-repeat;position: absolute; top: -145px; left: 0; z-index: 2;}

#home #box-01 .img-leaf{ position: absolute; right:50px; top:0;}
#home #box-01 .area-img{ width: 50%; min-height:900px; position: absolute; left:0; top:0;}
#home #box-01 .area-img .img{ position: absolute;}
#home #box-01 .area-img .h-01{ left:7%; top:50px; width:30%; min-width:300px;}
#home #box-01 .area-img .h-02{ left:40%; top:260px; z-index:2; width:60%; min-width:470px;}
#home #box-01 .area-img .h-03{ left:12%; top:600px; width:40%; min-width:380px;}


#home #box-image{ background-image: url(../images/home/bk-image.jpg); background-size: cover; background-attachment: fixed; height:702px; background-position: center;}


#home #box-02{ position: relative; padding:100px 0 50px;}
#home #box-02 h2{ position:absolute; left:0; top:0px;}
#home #box-02 .area-01 { width: 1100px; margin:auto; overflow:hidden; padding-left: 130px; position: relative; box-sizing:border-box;}
#home #box-02 .area-01 .entry{ width: 300px; float: left; text-align: center; margin-right: 32px;}
#home #box-02 .area-01 .entry .tb-01{ display:inline-block; overflow:hidden;}
#home #box-02 .area-01 .entry .tb-01 .runowa-ru{ border:#CCC dotted 1px; padding:50px;}
#home #box-02 .area-01 .entry:nth-of-type(3){ margin-right:0;}
#home #box-02 .area-01 .entry a{ display: inline-block; text-decoration: none;}
#home #box-02 .area-01 .entry a:hover{ opacity:1;}
#home #box-02 .area-01 .entry a:hover img{ transform:scale(1.03,1.03); filter:brightness(105%);}
#home #box-02 .area-01 .entry a:hover h3{ color:#8f20cf;}
#home #box-02 .area-01 .entry a:hover p { color:#8f20cf;}
#home #box-02 .area-01 .entry .img{ width:300px; height: 300px; border-radius:50%; border:15px solid #efefef; overflow: hidden; margin-bottom: 15px; box-sizing:border-box;}
#home #box-02 .area-01 .entry .img img{ width: 100%; height: 100%; object-fit:cover; transition: .5s; box-sizing:border-box;}
#home #box-02 .area-01 .entry h3{ font-size:20px; font-weight: bold; margin-bottom: 5px; transition: .5s;}
#home #box-02 .area-01 .entry .price{ font-size: 24px; font-weight: bold; transition: .5s;}
#home #box-02 .area-01 .more{ float: right; margin-top:50px;}



#home #box-03{ width: 1300px; padding:100px 0 100px;}
#home #box-03 h2{ text-align: center; margin-bottom: 50px;}
#home #box-03 .area-01{ background:#fff; overflow:hidden; padding:100px 100px 50px; position: relative;}
#home #box-03 .area-01 h3{ font-size: 18px; font-weight: bold; display: inline-block; text-align: center; position: absolute; left:0; right:0; top:40px; margin:auto;}
#home #box-03 iframe { width: 1100px; height: 450px; overflow: hidden; }


#home #box-04{ padding:80px 0 100px;}
#home #box-04 h2{ position:absolute; right:0; top:0px;}
#home #box-04 .area-01{ overflow:hidden; position: relative;}
#home #box-04 .area-01 .news{ background:#fff; width:980px; overflow-y:scroll; max-height:450px; box-sizing:border-box;}
#home #box-04 .area-01 .news table { width: 100%;}
#home #box-04 .area-01 .news table th { font-weight: bold; color:#6ba23c; width:140px; padding:20px 0 0 30px; border-bottom: 1px dashed #ccc; text-align:left; vertical-align:top;}
#home #box-04 .area-01 .news table th span{ position: relative;}
#home #box-04 .area-01 .news table th span::before{ content: ""; position: absolute; top: 50%; left:-15px; transform: translateY(-50%); border:4px solid transparent; border-left:6px solid #2c2c2c;}
#home #box-04 .area-01 .news table td { padding:20px 30px 20px 0; border-bottom: 1px dashed #ccc; font-size:15px; letter-spacing:normal;}
#home #box-04 .area-01 .news table td span{ font-size:17px; font-weight:bold; display:block; letter-spacing:1px; margin-bottom:5px;}

#home #box-05{ position: relative; padding:100px 0 50px;}
#home #box-05 h2{ }
#home #box-05 .area-01{ width:1100px; margin:auto; }
#home #box-05 .area-01 .runowa-ru{ overflow: hidden; clear: both;}
#home #box-05 .area-01 .runowa-ru h3{ font-size: 30px; margin-bottom: 20px;}
#home #box-05 .area-01 .runowa-ru p{ line-height:2em; font-family:'Zen Old Mincho', serif;}
#home #box-05 .area-01 .runowa-ru img{ float: left;}
#home #box-05 .area-01 .runowa-ru .right{ width: 750px; float: right;}
#home #box-05:before{ content: ""; display: block; width: 100%; height: 351px; background-image: url(../images/home/bk-bottom.png); background-size: 100% 100%; position: absolute; top: -350px; left: 0; z-index: 2;}



#box-contact{ clear:both;}
#box-contact .area-01{ overflow:hidden;}
#box-contact .area-01 .entry{ width:50%; float:left;}
#box-contact .area-01 .entry:last-child{ float:right;}
#box-contact .area-01 .entry a{ height:500px; display:block; text-decoration:none; position:relative;}
#box-contact .area-01 .entry a .img{ width:100%; height:100%; filter:brightness(50%); object-fit:cover; transition:.5s;}
#box-contact .area-01 .entry a:hover{ opacity:1;}
#box-contact .area-01 .entry a:hover .img{ filter:brightness(100%);}


#box-contact .area-01 .entry .p-01{ font-size:20px; color:#fff; text-align:center; display: inline-block; position: absolute; top:130px; left:0; right:0; margin:auto; font-family:"Noto Serif JP", serif;}
#box-contact .area-01 .entry .p-02{ font-size:48px; font-weight:bold; color:#fff; text-align:center; line-height:1.7em; padding:20px 0 0; display:inline-block; font-family:"Noto Serif JP", serif; position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; height:140px;}
#box-contact .area-01 .entry .p-02 span{ font-size:28px; font-weight:normal; line-height:2em; display:block;}
#box-contact .area-01 .entry .p-02 img { display:block; margin:20px auto 0;}


#box-insta .entry{ float: left; overflow: hidden; border-radius:30px; margin:0 20px 20px 0;}
#box-insta .entry:nth-of-type(5n){ margin-right: 0;}
#box-insta .entry a img{ transition: .5s; width: 204px; height: 204px; object-fit: cover;}
#box-insta .entry a{ display: inline-block; text-decoration: none;}
#box-insta .entry a:hover img{ transform:scale(1.02,1.02);}


/*----------  SHAIN ONEについて about  ----------*/
/*----------  SHAIN ONEについて about  ----------*/
/*----------  SHAIN ONEについて about  ----------*/

#about #box-01{ background:url(../images/about/bk-omoi.jpg)center top no-repeat; height: 622px; margin-bottom:80px;}
#about #box-01 .area-01{ width: 1100px; margin:auto; overflow: hidden; padding-right: 110px; position: relative;}
#about #box-01 .area-01 h2{ top:80px;}
#about #box-01 .area-01 .tb{ width: 580px; float: right; padding-top:50px;}
#about #box-01 .area-01 .tb h3{ font-size:28px; font-weight: bold; line-height:2em; margin-bottom:50px;}
#about #box-01 .area-01 .tb p { line-height: 2em; margin-bottom: 30px; font-family:'Zen Old Mincho', serif;}
#about #box-01 .area-01 img{ position: absolute; left:0; top:100px;}


#about #box-02{ padding-bottom: 100px;}
#about #box-02 .bk-01{ background:url(../images/about/bk-01.jpg)center top no-repeat; height: 710px; position: relative; margin-bottom:0px;}
#about #box-02 .bk-02{ background:url(../images/about/bk-02.jpg)center top no-repeat; height: 710px; position: relative; margin-bottom:0px;}
#about #box-02 .bk-03{ background:url(../images/about/bk-03.jpg)center top no-repeat; height: 710px; position: relative;}
#about #box-02 .area-01{ width: 1100px; margin:auto; overflow: hidden;}
#about #box-02 .area-01 .tb{ width: 550px; padding-top:80px;}
#about #box-02 .area-01 .tb.right{ float: right;}
#about #box-02 .area-01 .tb .p-01{ font-size: 30px; font-weight: bold; line-height: 1.2em; margin-bottom:20px; font-family:'Zen Old Mincho', serif;}
#about #box-02 .area-01 .tb .p-01 span{ font-size:58px; font-weight:500; display: inline-block; line-height: 1.2em; margin-left:5px;}
#about #box-02 .area-01 .tb h2{ font-size:32px; font-weight:500; margin-bottom: 50px;}
#about #box-02 .area-01 .tb p { line-height:2em; margin-bottom: 30px;}
#about #box-02 .bk-03 .area-01 .tb h2{ font-size: 28px;}


#about #box-03{ padding-bottom: 100px;}
#about #box-03 h3{ font-size: 32px; font-weight: bold; border-bottom:6px dotted #6ba23c; padding-bottom: 15px; margin-bottom: 30px;}
#about #box-03 p { line-height: 1.8em;}
#about #box-03 .area-01{ background:#fff; padding:50px 50px; border-radius:30px; position: relative; margin-bottom: 50px;}
#about #box-03 .area-01 .tb{ width: 600px;}
#about #box-03 .area-01 img{ position: absolute; top:40px; right:40px;}

#about #box-03 .area-02{ background:#fff; padding:50px 50px; border-radius:30px; position: relative; overflow: hidden;}
#about #box-03 .area-02 .tb{ width: 600px; float: right;}
#about #box-03 .area-02 img{ position: absolute; top:40px; left:40px;}





/*----------  当園の葡萄 budou  ----------*/
/*----------  当園の葡萄 budou  ----------*/
/*----------  当園の葡萄 budou  ----------*/

#budou #box-01{}
#budou #box-01 h2{ font-size: 26px; font-weight: bold; text-align: center; line-height: 2em; margin-bottom: 50px;}
#budou #box-01 p { font-size: 18px; text-align: center; line-height: 2.5em; margin-bottom: 80px; font-family:'Zen Old Mincho', serif;}
#budou #box-01 .area-01{ overflow: hidden;}
#budou #box-01 .area-01 .entry{ width: 328px; float: left; padding-bottom: 50px; margin-right: 30px; position: relative;}
#budou #box-01 .area-01 .entry:last-child{ margin-right: 0;}
#budou #box-01 .area-01 .entry .btn-01{ width: 100%; font-size: 18px; font-weight: bold; padding-right: 57px; position: absolute; left:0; bottom:0px; box-sizing:border-box; font-family:'Zen Old Mincho', serif; display:table; height:70px;}
#budou #box-01 .area-01 .entry .btn-01 a{ width: 100%; background:#272727; color:#fff; padding:0px 0 0px 20px; display: table-cell; text-decoration: none; position: relative;vertical-align:middle;}
#budou #box-01 .area-01 .entry img.img-01{ position:absolute; bottom:30px; right:34px;}
#budou #box-01 .area-01 .entry .btn-01 a span{ font-size:90%; letter-spacing:normal;}

#budou #box-02{ background:url(../images/budou/bk-01.jpg)center 100px no-repeat; height: 635px; margin-bottom:30px;}
#budou #box-02 .area-01{ width: 1100px; margin:auto; overflow: hidden; padding-top: 60px; position: relative;}
#budou #box-02 .area-01 .tb{ width: 550px; float: right; padding-top: 100px;}
#budou #box-02 .area-01 .b-01{ position:absolute; left:0; top:160px;}
#budou #box-02 .area-01 .b-02{ position:absolute; left:230px; top:180px;}
#budou #box-02 .area-01 .b-03{ position:absolute; left:0; bottom:0px; z-index:2;}


#budou #box-03{ background:url(../images/budou/bk-02.jpg)center 100px no-repeat; height: 635px; margin-bottom:30px;}
#budou #box-03 .area-01{ width: 1100px; margin:auto; overflow: hidden; padding-top: 60px; position: relative;}
#budou #box-03 .area-01 .tb{ width: 550px; padding-top: 100px;}
#budou #box-03 .area-01 .b-04{ right:0; top:160px; z-index:2;}
#budou #box-03 .area-01 .b-05{ right:190px; bottom:0px;}


#budou #box-04{ background:url(../images/budou/bk-03.jpg)center 100px no-repeat; height: 800px; margin-bottom:120px;}
#budou #box-04 .area-01{ width: 1100px; margin:auto; overflow: hidden; padding-top: 60px; position: relative;}
#budou #box-04 .area-01 .tb{ width: 550px; float: right; padding-top: 100px;}
#budou #box-04 .area-01 .b-06{ left:0; top:160px;}
#budou #box-04 .area-01 .b-07{ left:230px; top:180px;}
/*共通*/
#budou .h2-04{ font-size: 24px; font-weight:500; margin-bottom: 30px;}
#budou .h2-04 span{ background:#2c2c2c; font-size:28px; color:#fff; line-height: 1.2em; display: inline-block; padding:10px 20px; margin-bottom:10px;}
#budou .tb p{ line-height: 2em; font-family:'Zen Old Mincho', serif;}
#budou .point{ background:#fff; border-radius:20px; padding:25px 25px; margin-top:35px;}
#budou .point h3{ background:url(../images/budou/h3-01.png)left top no-repeat; font-size: 20px; font-weight:500; color:#709726; padding-left: 40px; line-height: 2em;}
#budou .point p { font-size: 15px; letter-spacing: normal; line-height: 1.8em; font-family:'Zen Old Mincho', serif;}
#budou .img{ position:absolute;}


#budou #box-05{ background:url(../images/budou/bk-04.jpg)center top no-repeat; height: 796px;}
#budou #box-05 h2{ padding-top: 80px;}
#budou #box-05 p { width: 780px; line-height: 1.8em; margin:0 auto 30px;}
#budou #box-05 .area-01{ background:#fff; width: 1024px; padding:30px 30px; margin:auto; border-radius:30px; box-sizing:border-box;}





/*▼▼▼スクロールでふわっと表示▼▼▼*/

/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {
  transition-timing-function:cubic-bezier(.64,.04,.35,1);
  transition:0.9s ease-in-out;
  transform:translateY(30px);
  opacity:0;
}

.scroll_up.on {
  transform:translateY(0);
  transition:0.9s ease-in-out;
  opacity:1.0;
}
.scroll_on {
  transition-timing-function:cubic-bezier(.64,.04,.35,1);
  transition:0.9s ease-in-out;
  transform:translateY(0px);
  opacity:0;
}

.scroll_on.on {
  transform:translateY(0);
  opacity:1.0;
}

.scroll_right.on {
    opacity:1.0;
    filter:alpha(opacity=100);
    -moz-opacity:1.0;
    transform:translateX(0);
}


/* 画像のスクロール */
.h-01,
.h-02,
.h-03,
.b-01,
.b-02,
.b-03,
.b-04,
.b-05,
.b-06,
.b-07 { transition:.5s;}