@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
box-sizing: border-box;
}
html{
line-height: 1;
}
.clearfix:after{
content: "";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix{
display: inline-table;
}
/* Hides from IE-mac \*/
* html .clearfix{
height: 1%;
}
.clearfix{
display: block;
}
/* End hide from IE-mac */
ol, ul{
list-style: none;
}
table{
border-collapse: collapse;
border-spacing: 0;
}
.clear {
clear: both;
}
em.red{
color: #d4145a;
}
caption, th, td{
text-align: left;
font-weight: normal;
vertical-align: middle;
}
q, blockquote{
quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after{
content: "";
content: none;
}
a img {
border: none;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary{
display: block;
}
*, :after, :before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body{
color: #000;
font-family: 'M PLUS Rounded 1c', sans-serif;
line-height: 1.5;
-webkit-text-size-adjust: 100%;
}
img{
height: auto;
max-width: 100%;
}
a{
text-decoration: none;
}
@media screen and (max-width: 768px) {
.hidden-sp{
display: none !important;
}
}
@media screen and (min-width: 769px) {
.hidden-pc{
display: none !important;
}
}
/*------------------------------------------
サービス別レスポンシブ
------------------------------------------*/
/*youtube*/
.youtubeWrapper{
position: relative;
width: 100%;
padding-top: 56.25%;
}
.youtubeWrapper iframe {
position: absolute;
top: 0;
right: 0;
width: 100% !important;
height: 100% !important;
}
/*googlemap*/
.ggmapWrapper{
position: relative;
/*padding-bottom: 56.25%;*/
height: 390px;
overflow: hidden;
}
.ggmapWrapper iframe,
.ggmapWrapper object,
.ggmapWrapper embed{
position: absolute;
top: -200px;
left: 0;
width: 100%;
height: 600px;
}
.ggmapWrapper iframe{
height: 800px;
}
/*------------------------------------------
cmn
------------------------------------------*/
img{
vertical-align: top;
}
.hoverBtn{
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
.hoverBtn:hover{
}
@media screen and (max-width: 768px) {
img{
width: 100%;
}
}
/*------------------------------------------
body
------------------------------------------*/
body{
}
@media screen and (max-width: 768px) {
}
/*------------------------------------------
nav
------------------------------------------*/
@media screen and (min-width: 769px) {
header{
width: 100%;
background: url("../img/bg_header.png") repeat center top / 1600px;
box-shadow: 0 7px 10px rgba(0,0,0,0.3);
position: fixed;
top: 0;
left: 0;
z-index: 1000;
ul{
max-width: 980px;
margin: 0 auto;
li{
width: 20%;
float: left;
}
}
}
}
@media screen and (max-width: 768px) {
header{
width: 50px;
height: 50px;
background: url("../img/bg_header.png") repeat center top / 1600px;
box-shadow: 0 7px 10px rgba(0,0,0,0.1);
position: fixed;
top: 0;
right: 0;
z-index: 10000;
ul{
width: 100%;
margin: 0 auto;
li{
float: left;
}
}
}
nav{
}
nav > .boxLR{
width: 0%;
margin: 0 auto;
padding: 20px 0;
box-shadow: 0 0 5px rgba(0,0,0,0.2);
position: fixed;
top: 50px;
right: 0;
background: #FFF;
display: block;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
li{
width: 50%;
float: left;
}
&.active{
width: 100%;
}
}
nav > .menuBtn{
width: 30px;
float: inherit;
position: fixed;
right: 10px;
top: 11px;
z-index: 3;
}
nav .menuBtn img.close{
display: none;
}
nav .menuBtn.active img.open{
display: none;
}
nav .menuBtn.active img.close{
display: inline-block;
}
}
/*------------------------------------------
footer
------------------------------------------*/
footer{
padding: 25px 0 25px 0;
background: #6a3906;
box-sizing: border-box !important;
}
footer *{
line-height: 1.5 !important;
font-family: sans-serif !important;
box-sizing: border-box !important;
letter-spacing: 1px !important;
}
footer .innerBox{
max-width: 980px;
margin: 0 auto;
}
footer #links{
float: right;
font-size: 12px;
color: #FFF;
}
footer #links *{
color: #FFF;
text-decoration: none;
font-size: 12px;
}
footer #links a:hover{
text-decoration: underline;
}
footer #copy{
float: left;
}
footer #copy small{
font-size: 12px;
color: #FFF;
}
.pageLink{
width: 980px;
margin: 0 auto 25px auto;
ul{
width: 100%;
display: table;
border-collapse: collapse;
li{
padding: 0 30px;
display: table-cell;
border-right: 1px solid #FFF;
border-left: 1px solid #FFF;
text-align: center;
a{
font-size: 15px;
color: #FFF;
&:hover{
text-decoration: underline;
}
}
}
}
}
@media screen and (max-width: 768px) {
footer{
width: 100%;
padding: 5%;
margin: 0 auto;
text-align: center;
}
footer .innerBox{
width: 100%;
}
footer #links{
float: inherit;
padding-bottom: 1%;
}
footer #links,
footer #links *{
font-size: 12px;
}
footer #copy{
float: inherit;
font-size: 12px;
}
footer #copy small{
font-size: 12px;
}
.pageLink{
width: 100%;
margin: 0 auto 25px auto;
ul{
width: 100%;
display: block;
border-collapse: collapse;
text-align: center;
li{
padding: 0 10px;
display: inline-block;
border-right: none;
border-left: none;
text-align: center;
&:first-child{
border-left: none;
}
a{
font-size: 11px;
color: #FFF;
&:hover{
text-decoration: underline;
}
}
}
}
}
}
/*------------------------------------------
mv
------------------------------------------*/
#mv{
padding: 170px 0 60px 0;
background: #f7eacd;
li{
text-align: center;
img{
max-width: 1420px;
width: 100%;
display: inline-block;
}
}
.slick-dots{
bottom: 20px;
li{
button{
&:before{
font-size: 26px;
color: #FFF;
}
}
}
}
}
@media screen and (max-width: 768px) {
#mv{
padding: 0 0 60px 0;
}
}
/*------------------------------------------
#links_01
------------------------------------------*/
.bgWrapper{
background: #f7eacd;
position: relative;
margin-bottom: 70px;
&:after{
content: "";
width: 100%;
height: 25px;
display: block;
position: absolute;
left: 0;
bottom: -25px;
background: url("../img/bg_bottom.png") repeat-x center bottom / 1600px;
}
}
h2{
text-align: center;
margin-bottom: 50px;
}
#links_01{
max-width: 980px;
margin: 0 auto 60px auto;
padding: 0 0 50px 0;
background: url("../img/dot_01.png") no-repeat center bottom / 980px;
position: relative;
ul{
max-width: 615px;
margin: 0 auto;
li{
margin: 0 0 35px 0;
float: left;
&:nth-child(even){
float: right;
}
a{
width: 283px;
height: 71px;
display: block;
background: url("../img/btn_out.png") no-repeat center / 283px 71px;
position: relative;
&:after{
content: "";
width: 0;
height: 71px;
display: block;
background: url("../img/btn_over.png") no-repeat left center / 283px 71px;
opacity: 0;
position: absolute;
left: 0;
top: 0;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
}
> span{
display: table;
width: 100%;
height: 100%;
position: relative;
z-index: 3;
> span{
display: table-cell;
text-align: center;
vertical-align: middle;
font-size: 22px;
font-weight: bold;
color: #FFF;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
}
}
&:hover{
&:after{
width: 283px;
opacity: 1;
}
> span{
> span{
color: #000;
}
}
}
}
}
}
.illust_01{
position: absolute;
left: 50%;
top: 120px;
-ms-transform: translate(-600px, 0);
-webkit-transform: translate(-600px, 0);
-moz-transform: translate(-600px, 0);
-o-transform: translate(-600px, 0);
transform: translate(-600px, 0);
}
.illust_02{
position: absolute;
left: 50%;
top: 15px;
-ms-transform: translate(370px, 0);
-webkit-transform: translate(370px, 0);
-moz-transform: translate(370px, 0);
-o-transform: translate(370px, 0);
transform: translate(370px, 0);
}
}
@media screen and (max-width: 1155px) {
.illust_02{
display: none;
}
}
@media screen and (max-width: 768px) {
.bgWrapper{
margin-bottom: 70px;
}
h2{
text-align: center;
margin-bottom: 50px;
img{
max-width: 400px;
}
}
#links_01{
width: 100%;
margin: 0 auto 60px auto;
padding: 0 0 50px 0;
background: url("../img/dot_01.png") no-repeat center bottom / 980px;
position: relative;
ul{
width: 100%;
margin: 0 auto;
li{
margin: 0 auto 35px auto;
float: inherit;
&:nth-child(even){
float: inherit;
}
a{
margin: 0 auto;
> span{
> span{
font-size: 20px;
}
}
}
}
}
.illust_01{
position: absolute;
left: 10px;
top: 160px;
width: 60px;
-ms-transform: inherit;
-webkit-transform: inherit;
-moz-transform: inherit;
-o-transform: inherit;
transform: inherit;
}
.illust_02{
display: inline-block;
position: absolute;
left: inherit;
right: 10px;
top: inherit;
bottom: 30px;
width: 50px;
-ms-transform: inherit;
-webkit-transform: inherit;
-moz-transform: inherit;
-o-transform: inherit;
transform: inherit;
}
}
}
/*------------------------------------------
#links_02
------------------------------------------*/
#links_02{
max-width: 980px;
margin: 0 auto;
padding: 0 0 45px 0;
position: relative;
ul{
max-width: 615px;
margin: 0 auto;
li{
margin: 0 0 35px 0;
float: left;
&:nth-child(even){
float: right;
}
a{
width: 283px;
height: 71px;
display: block;
background: url("../img/btn_out.png") no-repeat center / 283px 71px;
position: relative;
&:after{
content: "";
width: 0;
height: 71px;
display: block;
background: url("../img/btn_over.png") no-repeat left center / 283px 71px;
opacity: 0;
position: absolute;
left: 0;
top: 0;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
}
> span{
display: table;
width: 100%;
height: 100%;
position: relative;
z-index: 3;
> span{
display: table-cell;
text-align: center;
vertical-align: middle;
font-size: 22px;
font-weight: bold;
color: #FFF;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
}
}
&:hover{
&:after{
width: 283px;
opacity: 1;
}
> span{
> span{
color: #000;
}
}
}
}
}
}
.illust_03{
position: absolute;
left: 50%;
top: 100px;
-ms-transform: translate(-570px, 0);
-webkit-transform: translate(-570px, 0);
-moz-transform: translate(-570px, 0);
-o-transform: translate(-570px, 0);
transform: translate(-570px, 0);
}
.illust_04{
position: absolute;
left: 50%;
top: -20px;
-ms-transform: translate(290px, 0);
-webkit-transform: translate(290px, 0);
-moz-transform: translate(290px, 0);
-o-transform: translate(290px, 0);
transform: translate(290px, 0);
}
}
@media screen and (max-width: 1092px) {
.illust_04{
display: none;
}
}
@media screen and (max-width: 768px) {
#links_02{
width: 100%;
margin: 0 auto;
padding: 0 0 35px 0;
position: relative;
ul{
width: 100%;
margin: 0 auto;
li{
margin: 0 0 35px 0;
float: inherit;
&:nth-child(even){
float: inherit;
}
a{
width: 283px;
height: 71px;
margin: 0 auto;
> span{
> span{
font-size: 20px;
}
}
}
}
}
.illust_03{
position: absolute;
left: 10px;
top: 150px;
-ms-transform: inherit;
-webkit-transform: inherit;
-moz-transform: inherit;
-o-transform: inherit;
transform: inherit;
width: 50px;
}
.illust_04{
position: absolute;
left: inherit;
right: 10px;
top: inherit;
bottom: 20px;
-ms-transform: inherit;
-webkit-transform: inherit;
-moz-transform: inherit;
-o-transform: inherit;
transform: inherit;
width: 50px;
}
}
}
/*------------------------------------------
#links_03
------------------------------------------*/
.contents_bg_03{
position: relative;
z-index: 2;
&:before,
&:after{
content: "";
width: 542px;
height: 241px;
display: block;
position: absolute;
top: -15px;
}
&:before{
left: 0;
background: url("../img/illust_05.png") no-repeat left top / cover;
}
&:after{
right: 0;
background: url("../img/illust_06.png") no-repeat right top / cover;
}
}
#links_03{
max-width: 980px;
margin: 0 auto;
padding: 15px 0 55px 0;
background: url("../img/dot_01.png") no-repeat center bottom / 980px;
ul{
font-size: 0;
text-align: center;
li{
display: inline-block;
margin: 0 55px 25px 0;
a{
display: block;
&:hover{
.imgBox{
transform: scale(1.05);
}
p{
span{
background: url("../img/btn_over.png") no-repeat center / 70% 80%;
}
}
}
}
.imgBox{
width: 80%;
max-width: 260px;
margin: 0 auto 10px auto;
transform: scale(1);
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
img{
}
}
p{
width: 258px;
height: 68px;
margin: 0 auto;
font-size: 18px;
color: #000;
background: url("../img/bg_shopname.png") no-repeat center / 258px;
display: table;
span{
display: table-cell;
text-align: center;
vertical-align: middle;
}
}
}
}
}
@media screen and (min-width: 980px) {
#links_03{
ul{
li{
&:nth-child(3n){
margin-right: 0;
}
&:last-child{
margin-right: 0;
}
}
}
}
}
@media screen and (max-width: 1280px) {
.contents_bg_03{
position: relative;
z-index: 2;
&:before,
&:after{
content: "";
width: 400px;
height: 241px;
display: block;
position: absolute;
top: -15px;
}
&:before{
left: 0;
background: url("../img/illust_05.png") no-repeat left top / 400px;
}
&:after{
right: 0;
background: url("../img/illust_06.png") no-repeat right top / 400px;
}
}
}
@media screen and (max-width: 979px) {
#links_03{
ul{
li{
display: inline-block;
margin: 0 55px 25px 55px;
}
}
}
}
@media screen and (max-width: 768px) {
.contents_bg_03{
position: relative;
z-index: 2;
&:before,
&:after{
content: "";
width: 150px;
height: 241px;
display: block;
position: absolute;
top: -65px;
}
&:before{
left: 0;
background: url("../img/illust_05.png") no-repeat left top / 200px;
}
&:after{
right: 0;
background: url("../img/illust_06.png") no-repeat right top / 200px;
}
}
#links_03{
width: 100%;
margin: 0 auto;
padding: 15px 0 20px 0;
background: url("../img/dot_01.png") no-repeat center bottom / 980px;
ul{
li{
padding: 0 5%;
display: block;
margin: 0 0 50px 0;
&:nth-child(3n){
margin-right: 0;
}
&:last-child{
margin-right: 0;
}
a{
display: block;
.imgBox{
margin-bottom: 10px;
}
p{
width: 258px;
height: 68px;
margin: 0 auto;
font-size: 18px;
color: #000;
background: url("../img/bg_shopname.png") no-repeat center / 258px;
display: table;
span{
display: table-cell;
text-align: center;
vertical-align: middle;
}
}
&:hover{
opacity: 0.8;
}
}
}
}
}
}
/*------------------------------------------
#links_04
------------------------------------------*/
.contents_bg_04{
background: url("../img/bg_02.png") repeat center top / 20px;
position: relative;
top: -6px;
padding: 55px 0 25px 0;
margin-bottom: -6px;
&:after{
content: "";
width: 100%;
height: 25px;
display: block;
position: absolute;
bottom: 0;
background: url("../img/bg_top.png") repeat-x center top / 1600px;
}
}
#links_04{
ul{
li{
padding-bottom: 20px;
position: relative;
.innerBox{
width: 980px;
margin: 0 auto;
position: relative;
.txtBox{
h3{
margin-bottom: 22px;
}
}
.illust_07{
position: absolute;
bottom: 0;
left: 50%;
-ms-transform: translate(-570px, 80px);
-webkit-transform: translate(-570px, 80px);
-moz-transform: translate(-570px, 80px);
-o-transform: translate(-570px, 80px);
transform: translate(-570px, 80px);
}
.illust_08{
position: absolute;
bottom: 0;
left: 50%;
-ms-transform: translate(270px, 100px);
-webkit-transform: translate(270px, 100px);
-moz-transform: translate(270px, 100px);
-o-transform: translate(270px, 100px);
transform: translate(270px, 100px);
}
.illust_09{
position: absolute;
bottom: 0;
left: 50%;
-ms-transform: translate(-650px, 90px);
-webkit-transform: translate(-650px, 90px);
-moz-transform: translate(-650px, 90px);
-o-transform: translate(-650px, 90px);
transform: translate(-650px, 90px);
}
}
&:nth-child(odd){
.imgBox{
float: left;
padding-left: 10px;
position: relative;
z-index: 3;
}
.txtBox{
float: right;
width: 450px;
padding: 105px 10px 0 0;
position: relative;
z-index: 3;
p{
padding: 0 10px;
font-size: 16px;
}
}
&:after{
content: "";
width: 100%;
height: 548px;
display: block;
background: url("../img/line_01.png") no-repeat center top / 2986px;
position: absolute;
top: -460px;
}
}
&:nth-child(even){
.imgBox{
float: right;
padding-right: 20px;
position: relative;
z-index: 3;
}
.txtBox{
float: left;
width: 450px;
padding: 105px 0 0 10px;
position: relative;
z-index: 3;
p{
padding: 0 10px;
font-size: 16px;
}
}
&:after{
content: "";
width: 100%;
height: 556px;
display: block;
background: url("../img/line_02.png") no-repeat center top / 2986px;
position: absolute;
top: -460px;
}
}
&:nth-child(2){
padding-bottom: 70px;
}
&:nth-child(3){
padding-bottom: 110px;
}
}
}
}
@media screen and (max-width: 1190px) {
.illust_08{
display: none;
}
}
@media screen and (max-width: 979px) {
#links_04{
ul{
li{
padding-bottom: 20px;
position: relative;
.innerBox{
width: 100%;
margin: 0 auto;
position: relative;
.txtBox{
h3{
margin-bottom: 22px;
}
}
.illust_07{
position: absolute;
bottom: -50px;
left: inherit;
right: 10px;
-ms-transform: inherit;
-webkit-transform: inherit;
-moz-transform: inherit;
-o-transform: inherit;
transform: inherit;
width: 40px;
}
.illust_08{
display: inline-block;
position: absolute;
bottom: -20px;
left: inherit;
right: 10px;
-ms-transform: inherit;
-webkit-transform: inherit;
-moz-transform: inherit;
-o-transform: inherit;
transform: inherit;
width: 100px;
}
.illust_09{
position: absolute;
bottom: -80px;
left: inherit;
right: 10px;
-ms-transform: inherit;
-webkit-transform: inherit;
-moz-transform: inherit;
-o-transform: inherit;
transform: inherit;
width: 70px;
}
}
&:nth-child(odd),
&:nth-child(even){
.imgBox{
float: inherit;
padding: 0 5%;
position: relative;
z-index: 3;
text-align: center;
img{
max-width: 500px;
}
}
.txtBox{
float: inherit;
width: 100%;
max-width: 500px;
margin: 0 auto;
padding: 20px 5%;
position: relative;
z-index: 3;
p{
padding: 0 10px;
font-size: 16px;
}
}
&:after{
content: "";
width: 100%;
height: 548px;
display: block;
background: url("../img/line_01.png") no-repeat center top / 2986px;
position: absolute;
top: -490px;
}
}
&:nth-child(2){
padding-bottom: 30px;
}
&:nth-child(3){
padding-bottom: 110px;
}
}
}
}
}
/*------------------------------------------
#links_05
------------------------------------------*/
.contents_bg_05{
background: #f7eacd;
padding: 70px 0 0 0;
}
#links_05{
width: 980px;
margin: 0 auto;
padding: 0 0 100px 0;
dl{
padding: 15px 35px;
margin-bottom: 22px;
background: #FFF;
border: 1px solid #ffbe20;
border-radius: 25px;
cursor: pointer;
dt{
padding: 20px 30px 20px 90px;
background: url("../img/icon_q.png") no-repeat left center / 73px;
font-size: 24px;
font-weight: bold;
color: #6a3906;
position: relative;
&:after{
content: "";
width: 17px;
height: 15px;
display: block;
background: url("../img/icon_open.png") no-repeat right center / 17px;
position: absolute;
right: 0;
top: 50%;
-ms-transform: translate(0, -50%);
-webkit-transform: translate(0, -50%);
-moz-transform: translate(0, -50%);
-otransform: translate(0, -50%);
transform: translate(0, -50%);
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
}
}
dd{
padding: 10px 30px 0 0;
display: none;
}
}
dl.active{
dt{
&:after{
-ms-transform: translate(0, -50%) rotate(-180deg);
-webkit-transform: translate(0, -50%) rotate(-180deg);
-moz-transform: translate(0, -50%) rotate(-180deg);
-o-transform: translate(0, -50%) rotate(-180deg);
transform: translate(0, -50%) rotate(-180deg);
}
}
}
}
@media screen and (max-width: 979px) {
.contents_bg_05{
}
#links_05{
width: 100%;
margin: 0 auto;
padding: 0 0 100px 0;
dl{
width: 90%;
padding: 15px 20px;
margin: 0 auto 22px auto;
dt{
padding: 20px 30px 20px 60px;
background: url("../img/icon_q.png") no-repeat left center / 40px;
font-size: 20px;
font-weight: bold;
color: #6a3906;
position: relative;
&:after{
content: "";
width: 17px;
height: 15px;
display: block;
background: url("../img/icon_open.png") no-repeat right center / 17px;
position: absolute;
right: 0;
top: 50%;
-ms-transform: translate(0, -50%);
-webkit-transform: translate(0, -50%);
-moz-transform: translate(0, -50%);
-otransform: translate(0, -50%);
transform: translate(0, -50%);
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
}
}
dd{
padding: 10px 0 0 0;
display: none;
}
}
dl.active{
dt{
&:after{
-ms-transform: translate(0, -50%) rotate(-180deg);
-webkit-transform: translate(0, -50%) rotate(-180deg);
-moz-transform: translate(0, -50%) rotate(-180deg);
-o-transform: translate(0, -50%) rotate(-180deg);
transform: translate(0, -50%) rotate(-180deg);
}
}
}
}
}
/* ------------------------------
トップへ戻る
------------------------------ */
#toTop{
position: fixed;
right: 40px;
bottom: 10px;
display: none;
z-index: 4;
}
#toTop a{
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
#toTop a:hover{
opacity: 0.8;
}
@media screen and (max-width: 768px) {
#toTop{
right: 10px;
}
#toTop img{
width: 40px;
}
}