@charset "UTF-8"; /* CSS Document */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;} address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;} ul{list-style:none;} ul { list-style: none; } .shopping{ position:fixed; right:10px; top:3px; z-index: 9999; } html{ overflow-x : hidden; overflow-y : auto; } body{ box-sizing: border-box; margin: 0; padding: 0; border: none; width: 100%; overflow-x : hidden; overflow-y : auto; } [css] .body{ overflow-x: hidden; } [/css] [css] .html{ overflow-x: hidden; } [/css] #nav-drawer { position: relative; } /*チェックボックス等は非表示に*/ .nav-unshown { display:none; } #humb{ z-index: 999; position:relative; position: fixed; top:15px; left: 15px; color: rgba(22,103,57,1.00); content: ''; cursor: pointer; font-size: 20pt; } #en2{ position:absolute; position:fixed; z-index:998; top:5px; left:4px; } /*ハンバーガーアイコンをCSSだけで表現*/ #nav-open span, #nav-open span:before, #nav-open span:after { content: ''; cursor: pointer; } /*閉じる用の薄黒カバー*/ #nav-close { display: none;/*はじめは隠しておく*/ position: fixed; z-index: 99; top: 0;/*全体に広がるように*/ left: 0; width: 100%; height: 100%; background: black; opacity: 0; transition: .3s ease-in-out; } /*中身*/ #nav-content { overflow: auto; position: fixed; top: 0; left: 0; z-index: 9999;/*最前面に*/ width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/ max-width: 330px;/*最大幅（調整してください）*/ height: 100%; background-color:rgba(255,255,255,0.8);/*背景色*/ transition: .3s ease-in-out;/*滑らかに表示*/ -webkit-transform: translateX(-105%); transform: translateX(-105%);/*左に隠しておく*/ } /*チェックが入ったらもろもろ表示*/ #nav-input:checked ~ #nav-close { display: block;/*カバーを表示*/ opacity: .5; } #nav-input:checked ~ #nav-content { -webkit-transform: translateX(0%); transform: translateX(0%);/*中身を表示（右へスライド）*/ box-shadow: 6px 0 25px rgba(0,0,0,.15); font-family:"游明朝体 Pr6 R"; } .menu_text{ font-family: "游明朝体 Pr6 R"; margin-top: 60px; margin-left: 20px; font-size: 20px; } li{ margin-top: 40px; margin-bottom: 40px; } a{ color: rgba(37,37,37,1.00); text-decoration:none } .top:hover{ filter: alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7; /*画像を70%の不透明度にもし50%にしたいときは上から50、0.5、0.5にします*/ } .bsen{ position:relative; margin-top: 100px; margin-left: 20px; } .pagetop{ position:absolute; margin-top:-45px; right:145px; } #rt{ position:absolute; margin-top:-23px; margin-left:147px; z-index: 30; color:rgba(230,245,207,1.00); } #Box{ width: 100%; } #Box ul { margin: 0 auto; width: 700px; } .slider{ margin-top: 40px; } .slick-prev{ margin-left: 45px; } .slick-next{ margin-right:5px; } body { overflow-x: hidden; } [css] .body{ overflow-x: hidden; overflow:auto; } [/css] /* 全体の枠 */ .image-text { position: relative; } /* 重ねる文字 */ .text1 { position: absolute; top: 255px; right: 167px; color: ghostwhite; padding: 15px; font-size: 50px; line-height: 130%; font-family: "A-OTF Jun Pro 101", "A-OTF Midashi Go MB31 Pr6N MB31", AsagoHonmaruGothicmini, "Dejima Mincho", "Donguri Kana R"; writing-mode: vertical-rl; animation-name: fadein; animation-duration: 2.5s; animation-iteration-count: 1; } @keyframes fadein { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } h1{ font-family: "游明朝体 Pr6 R"; font-size: 16px; font-weight: normal; letter-spacing: 2px; text-align: center; margin-bottom: 20px; margin-top: 10px; } .nakami{ animation-name: fadein; animation-duration: 7s; animation-iteration-count: 1; } .innerS{ font-family: "游明朝体 Pr6 R"; width: 90%; font-size: 13px; margin-top: 0; margin-right: auto; margin-left: auto; margin-bottom: 40px; letter-spacing: -0.2px; } .flexcontainer_1{ display: flex; } .mura { display: block; font-size: 13px; text-align:center; width: 35%; margin-left: 10px; } .kuri { display: block; font-size: 13px; text-align:center; width: 35%; margin-left: 40px; } h1{ font-family: "游明朝体 Pr6 R"; font-size: 16px; margin-right: 15px; margin-left: 15px; letter-spacing:2px; font-weight:normal; margin-bottom: 40px; } h2{ font-family: "游明朝体 Pr6 R"; font-size: 16px; font-weight: normal; letter-spacing: 2px; text-align: center; margin-bottom: 60px; margin-top: 60px; } .clear{ clear: both; } .tumami{position: relative; } /* 全体の枠 */ .tumami { position: relative; margin-bottom: 20px; overflow-x: hidden; } /* 重ねる文字 */ .tumami_text{ position: absolute; top: 115px; right: 0px; width: 100%; font-size: 13px; line-height: 140%; left: 170pt; overflow-x: hidden; } .komono { position: relative; margin-bottom: 20px; } /* 重ねる文字 */ .komono_text{ position: absolute; top: 115px; right: 40px; width: 80%; font-size: 13px; line-height: 140%; } .milk { position: relative; margin-bottom: 20px; overflow-x: hidden; } /* 重ねる文字 */ .milk_text{ position: absolute; top: 80px; right: 0px; width: 100%; font-size: 13px; line-height: 140%; left: 115pt; overflow-x: hidden; } .tea { position: relative; margin-bottom: 20px; } /* 重ねる文字 */ .tea_text{ position: absolute; top: 115px; right: 40px; width: 80%; font-size: 13px; line-height: 140%; } .album { margin: auto; position: relative; } .album img { animation-name: album; -webkit-animation-name: album; animation-duration: 4s; -webkit-animation-duration: 3s; animation-iteration-count: 1; -webkit-animation-iteration-count: infinite; opacity: 0; } .album .img1 { display: block; margin: 0 auto; } .album .img2 { animation-delay:5s; -webkit-animation-delay:5s; position: absolute; top: 0; } @keyframes album { 0% { opacity: 0; } 12.5% { opacity: 1; } 37.5% { opacity: 1; } 50% { opacity: 0; } } @-webkit-keyframes album { 0% { opacity: 0; } 12.5% { opacity: 1; } 37.5% { opacity: 1; } 50% { opacity: 0; } } .flexcontainer_2{ display: flex; } .sizetext_dai{ font-family: "游明朝体 Pr6 R"; display: block; font-size: 13px; text-align: center; width: 35%; margin-left: 40px; padding-top: 70px; margin-bottom: 80px; line-height: 120%; left: 60px; } .sizedai{ margin-left: 30px; } .sizetext_syou { display: block; font-size: 13px; text-align: center; width: 35%; margin-left: 40px; margin-top: 70px; margin-bottom: 80px; line-height: 120%; } .setumei{ background-color: #C3DCCE; margin-bottom: 40px; padding-bottom: 40px; } .rogo{ margin-top: 20px; margin-bottom: 20px; } .setumei_text{ text-align: center; color: #FFFCFC; width: 90%; margin: 0 auto; } .ohana{margin-top: 5px; margin-bottom: 5px;} .tenpo{ font-family: "游明朝体 Pr6 R"; width: 90%; font-size: 13px; margin-top: 0; margin-right: auto; margin-left: auto; margin-bottom: 40px; letter-spacing: -0.4px; } .hp_link{text-decoration: underline;} .homepage{ width: 80%; margin: 0 auto; text-align: center; text-decoration: underline;}