body{font-family: 'Montserrat', sans-serif;font-weight: 400;background-color:fff;color:#333;font-size:1.5rem}

.topline{background:#3a3d46;color:#fff;height:3.6rem;line-height:3.6rem;font-size:1.3rem;font-weight:500}
.navline{background:#fff;height:6rem;padding:2rem 0;border-bottom:.1rem solid #d9d7d7}
.navline img.logo{float:left;height:6rem;}
.navisgoing{position: fixed;padding: .5rem 0;top: -11rem;width: 100%;z-index: 100;border-bottom: 1px solid #5D5D5D}
.navisgone{top:0;transition: .4s all ease}

.tlr{float:right}
.tll{float:left}
.topline span{font-weight:600}
.topline a{color:#fff;}
.topline a:hover{color:#fc0202}
#openmenu, .navlogo{display:none}
.cmmenu{display:none;width: 2.4rem;position: absolute;left: -4rem;top: 3rem}
.cmmenu img{float:left;width:100%}


nav{float:left;line-height: 6rem;margin: 0 5rem;}
nav a{font-weight:500;color:#333;margin: 0 2rem;text-transform: capitalize;}
nav a:hover{color:#fc0202}
nav a.monly{display:none}

#slider{padding:3rem 0}
.slider{width:calc(60% - 1.5rem);height:60rem;text-align:left;float:left;}
.slider h1, .slider h2{font-size:3.6rem;font-weight:600;letter-spacing:.1rem}
.slider h1 small{font-weight: 400;font-size: 50%;line-height: 50%;}
.afterslider{width:calc(40% - 1.5rem);color:#fff;height:28.5rem;float:left;margin:0 0 3rem 3rem;background-image: url(../img/bg/asbg1.jpg);background-position: center;background-size:cover;background-repeat: no-repeat}
.afterslider:last-child{background-image: url(../img/bg/asbg2.jpg);margin-bottom:0}
.afterslider p{margin: 1rem 0 2rem;font-weight: 500;line-height: 2.4rem;}
.afterslider a{display: block;float: left;}
.afterslider .linkbutton{width: max-content;}

.slide p a{color: #fc0202;}
.slide p a:hover{color: #fff;}

.asct{padding:4rem 2rem;height: calc(100% - 8rem);background: rgb(0 0 0 / 70%);}
.asct h2{font-size:3rem;font-weight: 500;letter-spacing: .1rem;}

.costop{background: #fc0202;color: #fff;font-weight: 600;position: absolute;line-height: 3rem;padding: 0 .4rem;font-size: 1.3rem;border-radius: .3rem;top: 1rem;right: 1rem;z-index: 3;}


.pcontainer{float:left;width:100%;padding:6rem 0;border-bottom:.1rem solid #e6e6e6}

.plus{float:left;width:calc(25% - 2.1rem);padding:0 1rem;text-align:center}
.plus svg{width:6rem;fill:#888;stroke:#888}
.plus:hover svg{fill:#fc0202;stroke:#fc0202}
.plus h3{font-size: 1.5rem;line-height: 2.2rem;text-transform: uppercase;}
.plus p{margin: 10px 0 0;font-size: 1.3rem;line-height: 1.8rem;color: #888}
.pline{float:left;width:.1rem;height:8.6rem;margin:2.5rem 0;background:#e6e6e6}

.title h2{position: relative;text-align:center;font-size: 3rem;font-weight: 500;line-height: 4rem;padding-bottom:2rem}
.title h2::after{content: "";border-bottom: .3rem solid #fc0202;position: absolute;width: 7rem;bottom: 0;left: 0;right: 0;margin: 0 auto;}

.tabs{text-align: center;padding:2rem 0}
.tabs li{display: inline-block;position: relative;list-style-type: none;margin:0}
.tabs li div{margin:0 2.5rem;font-weight: 500;letter-spacing: .1rem;cursor:pointer}
.tabs li div:hover{transform: scale(1.05);}
.tabs li div.actab{color:#fc0202;cursor:default}
.tabs li div.actab:hover{transform: scale(1);}

.item{position: relative;float:left;width:calc(25% - 2rem);margin:1rem;text-align:center}
.itemimg{position: relative;overflow:hidden}
.itemimg img{float:left;padding:10% 0;width:100%;background:#fff;filter: brightness(.96);}
#tables .itemimg img{filter: brightness(1)}
.itemimg img.img2{position: absolute;z-index:3;opacity:0;left: 0;top: 0;transition: .3s all ease-in;}
.itemimg:hover img.img2{opacity:1}
.item h3{position: relative;font-size:1.5rem;font-weight:500;letter-spacing:.1rem;padding-top:3rem}



.tpine h3::before{content: "сосна";position: absolute;width: 7rem;top: 1rem;left: 0;right: 0;margin: 0 auto;font-size:1.3rem;color: #888;letter-spacing: 0;font-style: italic;}
.toak h3::before{content: "дуб";position: absolute;width: 7rem;top: 1rem;left: 0;right: 0;margin: 0 auto;font-size:1.3rem;color: #888;letter-spacing: 0;font-style: italic;}
#hemnes .tpine h3::before{content: "Форест, сосна";width: 12rem;}

.iconlist{position: absolute;z-index:3;left: 0;right: 0;bottom: 5rem;margin: 0 auto;width: fit-content;border: 0.1rem solid #e6e6e6;border-right:none;opacity:0;pointer-events: none;transition: .5s all ease-out;}
.iconlist img{width: 2.4rem;padding: .8rem;float: left;filter: none;border-right:.1rem solid #e6e6e6;cursor:pointer}
.iconlist img:hover{background:#fc0202;filter:brightness(10)}
.itemimg:hover .iconlist{bottom:2rem;opacity:1;pointer-events: auto;}

#tables, #chairs, #chests, #faq, #contacts, #hemnes, #bed{padding:6rem 0}
#tables, #faq{background:#f5f5f5}
#chairs {background:#fbfbfb}
#hemnes .items{padding-top:3rem}


.showitem{position: fixed;top: 0;left: 0;right:0;bottom:0;margin:auto;width: 84rem;height: fit-content;background: #fff;padding: 2rem;z-index: 102;display:none}
#itemimg{float:left;width:42%;margin-right:3%;filter: brightness(.96)}
.lefthalft{float:left;width:55%}
.lefthalft p {margin: .5rem 0;font-size: 1.4rem;line-height: 1.9rem;border-bottom:.1rem dashed #d9d7d7}
.lefthalft p span{float:right;font-weight:500}
.lefthalft h3{font-size: 1.7rem;margin-top: 1.5rem;line-height: 2rem;}
#itemname{font-size: 1.8rem;text-transform: uppercase;line-height: 3rem;margin-bottom: 1rem;}
#itemprice  {color: #fc0202;font-weight:600}
#itemdescriptoin{font-size: 1.4rem;line-height: 2.2rem;}
.closeii {position: absolute;right: -4rem;top: 1rem;width:2.4rem;padding:.3rem;cursor:pointer;display:none}
.closeii:hover{transform: scale(1.07);}
.closeii img{float:left;width:100%}


.linkbutton {line-height:5.2rem;height:5.2rem;padding:0 2.5rem;background:#fc0202;color:#fff;border-radius:0;cursor:pointer;font-size:1.7rem;font-weight:600;text-align: center;letter-spacing: 0;text-transform: unset;border: none}
.linkbutton:hover{background:#333;color:#fff}
.lefthalft .linkbutton {width: 12rem;margin-top: 1.5rem}

.mask{position: fixed;display:none;width: 110%;height: 140vh;left: -5%;top: -5vh;z-index: 101;background: rgb(0 0 0 / 95%);transition: .5s all ease-out}
.acmask{backdrop-filter: blur(0.5rem);background: rgb(0 0 0 / 85%)}
.ovhi{overflow:hidden}

.orderwin h4{line-height: 4rem;font-size: 2.6rem;font-weight: 600;letter-spacing:.1rem;margin-bottom: .5rem;color: #fff;text-align: center}
.orderwin{width:40rem;height: 30rem;position:fixed;margin:calc(50vh - 15rem) calc(50% - 20rem);left:0;top:0;z-index:102;text-align: center;display:none}
.orderwin input{float: left;height: 5rem;padding: 0 1rem;border: 0;border-radius: 0;float: left;width: calc(100% - 2rem);outline: none;transition: .3s all ease;font-size: 1.4rem;color:#fff;background-color: transparent;border-bottom: 0.1rem solid #9da1a5;background-size: 2.2rem;background-position: bottom 1.4rem right 1rem;background-repeat: no-repeat;margin-bottom: 2rem}
.orderwin  input:hover, .orderwin  input:focus  {border-bottom: 0.1rem solid #fc0202}
.orderwin button{color: #333;width: 100%;margin-top: 1rem}
.orderwin .linkbutton {background: #fc0202;color: #fff;border:none}
.orderwin .linkbutton:hover {color:#fc0202;background:#333}
.fcin{background-image: url(../img/icon/fa.svg)}
.fcip{background-image: url(../img/icon/fp.svg)}
.orderclose, .closeser, .calcback, .callerclose{float: left;font-size: 13px;border-bottom: 1px dashed rgb(252 2 2 / 100%);color: #fc0202;line-height: 16px;width:58px;text-align: center;margin: 1rem calc(50% - 29px) 0;cursor: pointer;transition: .3s all ease;user-select: none}
.orderclose:hover, .closeser:hover{border-bottom: 1px dashed rgb(251 205 33 / 0%)}
.message {display:none;line-height: 2.2rem;font-size: 1.5rem;padding: 5rem 0;color: #fff}
.loader{width: 12.5rem;padding: 5.5rem 0;display:none}
.callerclose{position: absolute;bottom: -3rem;left: 0}

.faq{padding-top: 2.5rem;}
.fullq{width:90rem;margin:1rem calc(50% - 45rem);overflow: hidden;border:.1rem solid #e6e6e6;}
.fullq a {color: #333;border-bottom:.1rem dashed #fc0202}
.fullq a:hover{color:#fc0202}
.faqq{color: #333;padding: 2rem 2.5rem;cursor: pointer;transition: .2s ease;display: flex;justify-content: space-between;align-items: center}
.faqq h3{margin:0;color: #333;font-size: 1.7rem;font-weight:500;letter-spacing:.1rem}
.faqq .farrow{width: 2.4rem;transition: 0.25s ease;opacity: .3;user-select: none;}
.faqq:hover{background-color: #fff;}
.faqq:hover .farrow{opacity: 1}
.faractive{background-color: #fff}
.faqq .arrow-animate{transform: rotate(90deg);opacity: 1}
.facontent{background-color: #fff;display: none;padding: 0 2.5rem 2rem}
.facontent p, .prevtext p{margin:0}

.maparrow{width: 6.4rem;margin: 1rem 0 0 13rem;}

.cmblocks {display: flex;margin:0;color:#333}
.cmblock{float:left;width: calc(40% - 0.1rem);height:auto;padding:1.5rem 5%;}
.cmblock .cblock{color:#333}

.cmblock p {margin: 2rem 0;}

.cblock{text-align:right;color:#fff;margin-bottom: 1.5rem;line-height: 2.6rem;float: left;width: 100%;}
.cblock:first-child{margin-top:1.5rem}
.cblock b{font-size: 2rem;text-transform: uppercase;font-weight: 900;letter-spacing: .1rem;line-height: 3rem;}

.cmblock  .cblock a , .cmblock  .cblock p{color:#333;margin: 0;font-size: 1.5rem;}
.cmblock  .cblock a:hover{color: #fc0202;}
#contacts .cmblocks {display: block;margin-top:3rem}
#contacts .cmblock{float:right}

.ciform{float:left;width:100%;position:relative;}
.ciform .linkbutton{width:100%}

.ciform input, .ciform select{height: 5rem;padding: 0 1rem;border:0;border-radius: 0;float:left;width:calc(100% - 3rem);color: #333;background-color: #fff;border-bottom:.1rem solid #e6e6e6;font-size: 1.5rem;outline: none;margin-bottom:1rem}


.ciform input, .ciform select, .ciform textarea{background-size: 2.2rem;background-position: bottom 1.4rem right 1rem;background-repeat: no-repeat;}

.ciform select.fcit{width:31%;appearance: none;float: right;}

.ciform textarea {width: calc(100% - 2rem);border: 0;border-radius: 0;margin-top: 2rem;padding: 1rem;border-bottom:.1rem solid #e6e6e6;float: left;height: 8rem;resize: none;outline: none;}
.ciform input:hover, .ciform textarea:hover{border-bottom:.1rem solid #fc0202;}

.cpo a{float: right}
.cpo img{width: 1.8rem;float: left;margin:.4rem .8rem .4rem 0;}

.fcit{background-image: url(../img/icon/ft.svg);}
.fcim{background-image: url(../img/icon/fm.svg);}

.cmbl {border-right: 0.1rem solid #e6e6e6;}

.msngrs{float:left;width:100%;margin:.3rem 0 2rem}
.msngr {float:right;margin-left:.5rem;padding:.6rem;border-radius:.3rem;transition: .3s all ease;}
.msngr img{width:2rem;float: left;}
.msgrtg{background-color:#37AEE2}
.msgrvb{background-color:#7F4DA0}
.msgrwsp{background-color:#2AB200}
.msngr:hover{background-color:#151515!important}
.alert {float: left;line-height: 2rem;width: 100%;text-align: center;padding: 2rem 0;margin-top: 1rem;font-family: 'Roboto Condensed', sans-serif;letter-spacing:.05rem;font-size: 1.3rem;color: #a7a7a7;}

.cif2{width:16rem;height:16rem;position: absolute;left: 0;right: 0;top: 0;bottom: 0;margin: auto}
.cif3{width: 30rem;height:7rem;position: absolute;left: 0;right: 0;top: 0;bottom: 0;margin: auto}
.cif3 h5{font-size: 1.9rem;text-align: center;text-transform: uppercase;font-weight: 900;letter-spacing: -.1rem;color: #fc0202;margin: 0 0 1rem;line-height:2rem}
.cif3 p{text-align: center;font-size: 1.4rem;margin: 0;line-height:2rem}
.cif2, .cif3{display:none}

footer{padding:2rem 0; float: left;width: 100%;background:#333}
.uline{padding:1.5rem .5rem;border-bottom: 1px solid #e6e6e6}
.fline{padding:1.5rem .5rem;color:#fff;line-height:2rem}
.logotext{float:left;padding-right:1.5rem;border-right: 1px solid #e6e6e6;font-size: 2.4rem;font-weight: 900;color: #fff;line-height: 4.2rem;text-transform: uppercase;}
.logotext img{height:4.2rem;float:left;}
.logotext span{color:#fc0202}
.stotext{float: left;padding-left: 1.5rem;color: #fff;font-size: 1.3rem;opacity: .7;line-height: 4.2rem}
.socicon{float: right}
.socicon img{height: 1.8rem;margin: 1.2rem 0 .8rem 1.2rem;float: left;filter: brightness(199);transition: .3s ease-out;}
.socicon img:hover{filter:brightness(1)}
.ooo{float:left;color: #fff;font-size: 1.3rem;line-height: 2.4rem;}
.dev{float:right}
.dev p{font-size: 1.3rem;margin:2.4rem 0 0 0;line-height: 2.4rem;padding:0;opacity: .7;transition: .3s ease-out;}
.dev p:hover{opacity: 1}
.dev a{color:#fff;transition: .3s ease-out;}
.dev a:hover{color:#fc0202}

#downloads{padding: 6rem 0;background: #fbfbfb;}
.downloads{padding-top: 2.5rem;}
.doitem{float: left;width: 24%;margin:2rem .5%;transition: .3s ease;}
a .doitem:hover{transform: scale(1.05);}
.doitem img{width:40px;float:left;margin: 1px 7px 1px 0}
.doitem p {float: left;width: calc(100% - 4.7rem);margin: 2px 0 0;line-height: 2rem;font-size: 1.6rem;color:#333}
.doitem p i{font-size: 1.2rem;opacity: .75;font-style: normal;}

#opencall{display:block;width: 2.4rem;float: right;margin: 1.8rem 0 1.8rem 0;cursor:pointer;transition: .3s ease;}
#opencall:hover{transform: scale(1.1);}
#opencall img{float:left;width:100%}

.donly{display:block;font-weight:600;color: #fff;background: #fc0202;line-height: 2.8rem;float: right;margin: 1.6rem 1.5rem 1.6rem 0;cursor:pointer;padding:0 .8rem;transition: .3s ease;}
.donly:hover{background: #333;}

#map {height:50rem;border-top: .3rem solid #3a3d46;background-color:#3a3d46;background-image: url(../img/loader.svg);background-repeat: no-repeat;background-position:center;background-size: 10rem}
.caller{display:none;position: fixed;z-index:102;width: 32rem;padding:2rem 1.5rem;left: calc(50% - 17.5rem);top: calc(50% - 13.4rem);background: #fff;text-align:center}
.caller div.callerit, .cd{height:5rem;line-height:5rem;font-size:1.7rem;font-weight:500;color:#333}
.caller div.callerit span{font-size:12px}
.caller a div, .cd a {color:#333}
.caller a:first-child div{border-bottom:.1rem dashed #ebebeb}
.caller .linkbutton{margin-top:2rem}
.caller div img, .cd img {width:2rem;margin-bottom: -.4rem}

.cd {font-size:1.6rem;line-height:3rem;height:3rem;font-weight:400}

.msgr{position: fixed;bottom: 11rem;right: 5rem;width: 5rem;display:none;z-index: 4}
.msg{width: 4.2rem;float: left;border-radius: 50%;margin:0 .4rem .5rem;box-shadow: 2px 2px 6px -4px rgb(21 21 21)}
.msg img{width: calc(100% - 2rem);padding: 1rem;float: left}
.tg{background: #37AEE2}
.vib{background: #7F4DA0}

.wehave{display:none;background: #35af2d;color: #fff;font-weight: 600;position: absolute;line-height: 3rem;padding: 0 0.4rem;font-size: 1.3rem;border-radius: 0.3rem;top: 3rem;left: 3rem;z-index: 3;}

@keyframes myImgAnimation {
  0% { opacity: 0; }
  5% { opacity: 1; }
  45% { opacity: 1; }
  55% { opacity: 0; }
  100% { opacity: 0; }
  }
  
  @keyframes bgcolor {
  0% { transform: scale(.95);background: #37AEE2;box-shadow: 0 0 0 .5rem rgba(55, 174, 226, 12%)}
  49% { background: #37AEE2;box-shadow: 0 0 0 1rem rgba(55, 174, 226, 40%)}
  51% { transform: scale(1.2);background: #7F4DA0;box-shadow: 0 0 0 1.1rem rgba(127, 77, 160, 11%)}
  100% { transform: scale(.95);background: #7F4DA0;box-shadow: 0 0 0 .6rem rgba(127, 77, 160, 30%)}
}
 .msc {position: fixed;z-index: 4;bottom: 5rem;right: 5rem;width: 5rem;height: 5rem;float: left;border-radius: 50%;background: #151515;cursor:pointer;transition: .3s ease;display:none}
.msc:hover{background: #C23000}
.msc img{width: calc(100% - 2.6rem);padding: 1.3rem;float: left}
.msgrb {position: fixed;z-index: 4;cursor:pointer;bottom: 5rem;right: 5rem;width: 5rem;height: 5rem;float: left;box-shadow: 0 0 0 0 rgba(55, 174, 226, 40%);border-radius: 50%;background: #37AEE2;animation-name: bgcolor; animation-duration: 8s; animation-iteration-count: infinite}
.msgrb img {position: absolute;opacity:0; width: calc(100% - 2rem);padding: 1rem;float: left; animation-name: myImgAnimation; animation-duration: 8s; animation-iteration-count: infinite; }
.msgrb img:nth-child(1) { animation-delay: 0s; }
.msgrb img:nth-child(2) { animation-delay: 4s; }


@media (max-width: 1000px){
.item{width: calc(33.33333% - 2rem);}
.fullq{width: 90%;margin: 1rem 5%}
.iconlist{bottom:2rem;opacity:1;pointer-events: auto;}
.slider{width:100%}
.afterslider{width:calc(50% - 1.5rem);margin:3rem 0 0}
.afterslider:last-child{margin-left:3rem}
.showitem{width:84%}
nav a{margin:0 1.2rem}
.doitem{width: 32.333333%;margin:2rem .5%;}
}

@media (max-width: 900px){
.showitem{width:50rem}
#itemimg, .lefthalft{width:100%;margin:0}
#itemimg{width: 70%;padding: 0 15%;background: #fff;margin-bottom:1.5rem}
.lefthalft .linkbutton{margin:1.5rem calc(50% - 8.5rem) 0}
nav{margin: 0 0 0 3rem;}
nav a{margin:0 .8rem}
}

@media (max-width: 790px){
.item h3{font-size:1.4rem}
.afterslider{width:calc(50% - 1rem);margin:2rem 0 0}
.afterslider:last-child{margin-left:2rem}
.asct h2{font-size:2.4rem}
.afterslider p{font-size:1.4rem;line-height:2rem}
nav{margin: 0 0 0 2rem;}
nav a{margin:0 .6rem}
.dotext{font-size:1.5rem}
.doitem{float: left;width: 200px;margin:20px calc(25% - 100px);}
}
@media (max-width: 760px){
nav{margin: 0 0 0 1.5rem;}
nav a{margin:0 .3rem}
}

@media (max-width: 740px){
.plus {float: left;width: calc(50% - 2.05rem)}
.pcontainer{border:none}
.pline{height: 13.6rem;margin: 0;}
.psl{width: 80%;height: 0.1rem;margin: 3rem 10%;}
.title h2{font-size:2.8rem}
}

@media (max-width: 730px){
.donly{display:none}
.item{width: calc(33.33333% - 1.5rem);margin:.75rem}
}

@media (max-width: 690px){
.item{width: calc(50% - 1.5rem);margin:.75rem}
}

@media (max-width: 650px){
.title h2{font-size:2.6rem}
.faqq h3{font-size:1.6rem}
.slider h1, .slider h2{font-size:3.4rem}
}

@media (max-width:630px){
.cmblock{width:100%;padding:1.5rem 0}
.cmbl{border:0}
.cblock {text-align:center}
.cblock a{display:inline-block;float: unset;}
.alert{padding: 2rem 0;}
.maparrow{display:none}
.afterslider{width:calc(50% - .75rem);margin:1.5rem 0 0}
.afterslider:last-child{margin-left:1.5rem}
.asct{padding:3rem 1.5rem;height: calc(100% - 6rem)}
.asct h2{font-size:2.2rem}
.afterslider p{font-size:1.3rem;line-height:1.8rem}
.showitem{width:calc(96% - 3rem);padding:1.5rem}
.closeii{width:2rem;right: 1rem;background: #fc0202;border-radius: 50%;padding:.8rem}
#itemname {font-size: 1.7rem;line-height: 2.8rem}
nav{margin: 0 0 0 1.1rem;}
nav a{margin:0 .2rem}
}

@media (max-width: 560px){
#openmenu{display: block;width: 2.4rem;float: right;margin: 1.8rem 0 1.8rem 2.5rem}
#openmenu img{float:left}
nav{display:none;position: fixed;top: 0;right: -60rem;z-index: 120;background: #fff;height: 110vh;width: 39rem;padding: 2rem 1.5rem 0;margin: 0;transition: .3s ease}
.mmenuo{right:0}
.navlogo{display:block;width: 18rem;margin: 2rem calc(50% - 9rem)}
.navi{position: inherit;}
nav a{display: block;position: relative;color: #333;font-size: 1.7rem;font-weight: 500;padding: 0 2rem;line-height: 3.8rem}
nav a.monly{display:initial}
.item{width: calc(50% - 1rem);margin:.5rem}
.afterslider{width:calc(50% - .5rem);margin:1rem 0 0}
.afterslider:last-child{margin-left:1rem}
.asct{padding:2.5rem 1rem;height: calc(100% - 5rem)}
.asct h2{font-size:2rem;letter-spacing:0}
.tlr span{display:none}
.slider h1, .slider h2{font-size:3.2rem}
.msgrb, .msc{right:2.5rem;bottom:2.5rem}
.msgr{bottom: 8.5rem;right: 2.5rem}
}

@media (max-width: 460px){
.item h3{letter-spacing: 0;}
.asct{text-align:center}
.afterslider a{float:none}
.afterslider .linkbutton{width:9rem;margin: 0 calc(50% - 7rem);}
.title h2{font-size:2.4rem}
.faqq h3{font-size:1.5rem}
.fullq{width: calc(100% - .2rem);margin: 1rem 0}
nav{width: 31rem;}
}

@media (max-width: 440px){
.ooo, .dev{width: 100%;text-align: center}
.plus p{font-size: 1.2rem;line-height: 1.6rem;}
.afterslider, .afterslider:last-child{width:100%;margin:2rem 0 0;height: auto;}
.slider p, .afterslider p{font-size: 1.5rem;line-height: 2.4rem;font-weight: 400;}
.slider h1, .slider h2{font-size:3rem}
}
@media (max-width: 410px){
.item h3{font-size:1.3rem}
.orderwin{width:90%;margin:calc(50vh - 15rem) 5%}
.doitem{float: left;width: 180px;margin:20px calc(25% - 90px);}
}
@media (max-width: 400px){
.tll span{display:none}
}
@media (max-width: 380px){
nav{width: 28rem;padding: 2rem 1rem 0;}
.item h3{font-size:1.2rem}
.dotext{font-size:1.3rem}
.doitem{float: left;width: 170px;margin:20px calc(25% - 85px);}
}

@media (max-width: 340px){
nav{width: 26rem;padding: 2rem 1rem 0;}
.doitem{float: left;width: 160px;margin:20px calc(25% - 80px);}
}