@charset "UTF-8";
/* CSS Document */

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

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%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
    font-family:'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',Osaka,'ＭＳ Ｐゴシック',sans-serif;
    color: #333;
    background-color: #fff;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	           quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	  border-collapse: collapse;
	  border-spacing: 0;
}


/*ここからサイト内CSS*/
html { font-size: 62.5%; } /* font-sizeは16pxの62.5%の10px */
body { font-size: 1.8rem; /*font-size : 18px と同等*/
      line-height: 2.3rem;} 
h1 { font-size: 1.6rem; } /* font-size: 16px と同等 */
h2 { font-size: 2.5rem; } /* font-size: 25px と同等 */
p{font-size: 1.6rem;}
a {
    color: #333;
    text-decoration: none;
    cursor: pointer;
   }
body{background-color: #EAE9E9;}
.wrap{
      width: 1000px;
      margin: 0 auto;
     background-color: #FFFFFF;
}
/*-------------------------メインビジュアル全体*/
.mainvisual{
    width: 100%;
    height: 530px;
    margin: 0 auto;
    background-image: url("img/home/main-bg.jpg");
    border-bottom: solid 10px #821E1F;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.35);
}
/* ----------------------------------------ヘッダー*/
   /* ----------------------  ナビゲーション*/
#sticky{
    position:fixed;
    top: 0;
}
.header{
         width: 1000px;
        height: 50px;
        display: flex;
        justify-content: space-between;
        align-items:center;
        background-color: rgba(13,13,13,0.80);
        z-index: 10;
}

.header h1 a{
             display: flex;
             align-items: center;
             color: #fff;
}
.header h1 img{
               padding:0  10px 0 10px ;
}
.nav {
    font-size: 1.5rem;
    display:flex;
}
.nav ul{
        display: none;
        position: absolute;
}
.nav li{
       padding: 0 10px;
       width: 80px;
}
.nav li:first-child{
                    width: 115px;
}
.nav a, .color1{
       color: #fff;
}
.nav .space1{
             margin: 0 3px;
}
.nav a:hover{
    color:#9F0103;
    text-shadow: 0 3px 2px #000;
}
aside{
      display: none;
}
/*-------------------------　メインビジュアル　文字　画像*/

.visual-word{
    width: 300px;
    height:100px;
}
.visual-item{
    width: 320px;
    height: 290px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
.visual{
    width: auto;
    height: 480px;
    display: flex;
    justify-content:space-around;
    align-items: center;
}
.visual-word h2{
                font-size: 4rem;
                margin-bottom: 30px;
                color:#9F0103;
                font-weight:bolder;
                text-shadow: 0 3px 2px #000;
                line-height: 2.8rem;
}
.visual .visual-word{
                    width: 400px;
                     height:130px;
                     font-size: 1.9rem;
                     padding-left: 30px;
                     color: #fff;
}
.visual-word p{
               font-size: 1.8rem;
                margin-bottom: 5px;
                color: #fff;
}
.mainvisual .visual-word .subttl{
                                 font-size: 1.8rem;
}
/* -----------------------------------------------------------------------------------  sp ヘッダー　*/
@media screen and (max-width:760px){
    
    .wrap{
          width: 100%;
    }
    .header{
            width: 100%;
    }
    body { font-size: 1.6rem; /*font-size : 16px と同等*/
      line-height: 2rem;} 
h1 { font-size: 1.4rem; } /* font-size: 14px と同等 */
h2 { font-size: 2rem; } /* font-size: 20px と同等 */
    #pc_menu{
        display: none;
    }
   
    aside{
        display:block;
          width: 100%;
        height: auto;
        top: 0;
        right: 0;
        position: fixed;
        z-index: 100;
    }
    aside button img{
                    position:absolute;;
                    top: 1rem;
                    right:1rem;
                    width: 12%; 
                    height: auto;
        cursor: pointer;
    }
    aside .toggle_ul{
                    width: 100%;
        height: 270px;
                    margin: 0;
                    padding: 60px 0;
                    top: 100px;
                    line-height: 5rem;
                    text-align: center;
                    position: absolute;
                    background-color: rgba(70,68,68,1.00);
                    display:none;
    }
    aside .toggle_ul li a{
                         color: #ffffff;
        text-shadow: 0 1px 1px #000;
         font-size: 2rem;
    }
    
.visual .visual-word{
    width: 100%;
    height:auto;
        text-align: center;
        margin: 35px auto 0;
        padding-left: 0;
}
.visual-item{
    width: 90%;
    height: auto;
    text-align: center;
}
    .visual-item img{
        transform: scale(0.8);
    }
    .visual{
    width: 100%;
    height: 480px;
  display: flex;
        flex-direction: column;
}
}
/* --------------------------  メイン　ここから　*/
/*  数字　　　*/
.main h2 {
          font-size: 2.2rem;
}
.main section{
              padding-top: 50px;
}
.main .home-no{
               font-size: 5.5rem;
               margin-right: 20px;
               margin-left: 20px;
               font-weight:800;
               font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
               margin: 0 20px 0 50px;
               text-shadow: 0 1px 3px rgba(0,0,0,0.4);
               color: #333;
}
.main .u-line{
              border-bottom: solid 1px rgba(0,0,0,0.9);
              box-shadow: 0 1px 0 rgba(255,255,255,0.5);
              padding: 0 20px 10px 0 ;
}
.main .sec1 h2 .sp_br,
.main .sec2 h2 .sp_br{
                      display: none;
}
@media screen and (max-width:760px){
    
    .main{
          width: 100%;
    }
    .main h2 {
          font-size: 1.8rem;
        line-height: 4rem;
}
    .main .home-no{
               font-size: 4rem;
               font-weight:800;
               font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
               margin: 0 20px 0 10px;
               text-shadow: 0 1px 3px rgba(0,0,0,0.4);
               color: #333;
}
    
}
/*　------------　section 1 */
.main{
     width: 100%;
}
.main .sec1{
            width: 100%;
            height: 500px;
            background-color: #FFFFFF;
            margin: 0 auto;
}
.main .sec1 p{
              display: block;
              text-align: center;
              padding: 100px 0 100px;
    
}
.main .sec1 p img{
    padding-bottom: 50px;
}
.main .sec1 img:hover{
    transform: rotate(5deg);
    transition-duration: .3s;
}
@media screen and (max-width:760px){
    
    .main .sec1{
                height: auto;
    }
    .main .sec1 h2 .sp_br{
                      display:block;
}
    .main .sec1 p{
        margin: 0px auto;
              padding:80px 0 30px;
}
    .main .sec1 img{
                    transform: scale(0.8);
                    width: 100%;
    }
    
}
/*  ------------ section 2 */
.main .sec2{
            width: 100%;
            height: 950px;
            background-color: #b7dedc;
            box-shadow: 0 -3px 2px rgba(0,0,0,0.1);
}
.main .sec2 p{    
              margin: 40px 150px 70px 150px;
}
.main .sec2 .sec2-box{
                      height: 200px;
                      display:flex;
                      justify-content:center;
                      margin-bottom: 30px;
                      box-shadow: 0 3px 8px rgba(0,0,0,0.3);
                      padding: 10px 0;
}
.main .sec2 .sec2-box dt{
                         width: 200px;
                         height: 200px;
                         margin-right: 40px;
}
.main .sec2 .sec2-box dd{                 
                         background-color: #fff;
                         width: 370px;
                         height:auto;
                         margin-top: 5px;
                         margin-left: 40px; 
                         word-break:break-all;
                         font-size: 1.6rem;
                         padding: 20px;
                         box-shadow: 0 3px 5px rgba(0,0,0,0.3);
}
.main .sec2 .new-box{
                        position: relative;
}
.main .sec2 .new-box .new{
                           position:absolute;
                           top:2px;
                           left: -61px;
                           transform: rotate(-15deg);
                           font-size: 5rem;
                           color:#FF8300;
                           font-weight:bolder;
                           text-shadow: 0 3px 5px rgba(0,0,0,0.5);
                           letter-spacing: 0.2rem;
                           font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}
@media screen and (max-width:760px){
    .main .sec2{
                height: auto;
    }
    .main .sec2 p{    
                  padding: 40px 0 30px 0;
                  width: 85%;
                  margin: 0 auto;
                  height: auto;
}
    .main .sec2 .sec2-box{
        height: auto;
                          display:flex;
                          flex-direction: column;                   
}
.main .sec2 .sec2-box dt{
                         width: 100%;
                         height: auto;
                         text-align: center;
                         margin: 10px 0 3px 0 ;
}
    .main .sec2 .sec2-box dt img{
                                 transform: scale(0.8);
    }
.main .sec2 .sec2-box dd{                 
                         width: 85%;
                         height:auto;
                         margin: 0 auto; 
                         margin-bottom: 30px;
                         line-height: 2.2rem;
}
    .main .sec2 .new-box .new{
                           top:5px;
                           left: 30px;
                           z-index: 10;
}
    
}
/*  ------------ section 3 */
.main .sec3{
            width: 100%;
            height: 700px;
            background-color: #FFFFFF;
            box-shadow: 0px 3px 3px rgba(0,0,0,0.2) inset;
            padding-top: 70px;
}
.main .sec3 section{
                    display: flex;
                    justify-content:center;                  
}
.main .sec3 .sec3wing{
                      margin-right: 25px;
                      vertical-align: bottom;
}
.main .sec3 .sec3p1{
                   margin: 30px 0 0 140px;
                   padding-bottom: 1rem;
                   border-bottom: 2px dashed rgba(241,168,193,1.00);
}
.main .sec3 .sec3p1 a:hover{
                            color: rgba(241,168,193,1.00);
}
.main .sec3 .sec3p2{
                   margin: 0px 0 0px 140px;
                  
                    padding-bottom: 1rem;
                    border-bottom: 2px dashed rgba(241,168,193,1.00);
}
.main .sec3 .sec3_paper{
                        width: 180px;
                        height: 250px;
                        margin:  1.4rem;
                        background: #f1f1f1;
                        box-shadow: 0 3px 8px rgba(0,0,0,0.3);
}

.main .sec3 .sec3_paper .sec3_ttl{
                                  font-size: 1.3rem;
                                  background-color: #9F1818;
                                  padding: 10px;
                                  text-align: center;
                                  color: #FFFFFF;
                                  font-weight: bold;
                                  letter-spacing: 0.05rem;
}
.main .sec3 .sec3_paper .ex-roll1{
                                  text-align: center;
                                  padding-top: 37%;    
}
.main .sec3 .sec3_paper .ex-roll2{
                                  text-align: center;
                                  padding-top: 36%;   
}
.main .sec3 .sec3_paper .ex-dice{
                                 text-align: center;
                                  padding-top: 30%;    
}
.main .sec3 .sec3_paper .ex-tiast{
                                  text-align: center;
                                  padding-top: 30%;
}
.main .sec3 .ex1a:hover, .main .sec3 .ex2a:hover, .main .sec3 .ex3a:hover, .main .sec3 .ex4a:hover{
                                                            transform:translate(0,-10px);
                                                            transition-duration: .5s;
                                                            background-color: #FFFFFF;
}
@media screen and (max-width:760px){
    
    .main .sec3{
                height:auto;
}
    .main .sec3 .sec3p1{
                        margin: 10px 0 0 0px;
                        text-align: center;
                      font-size: 1.6rem;
}
    .main .sec3 .sec3p2{
                        margin: 0;
                        text-align: center;
                        font-size: 1.6rem;
}
    .main .sec3 section{
                        display: flex;
                        flex-wrap: wrap;
                     margin-bottom: 100px;
}
}
/*----------------------------------------------------------------------------- 2Page タイアスト-------------------*/
.tiastvisual{
            width: 100%;
            height: 300px;
            background:url("img/tiast/water5.jpg");
            background-color: rgba(255,255,255,0.05);
            background-blend-mode: lighten;
            position: relative;
            box-shadow: 0px 3px 6px rgba(0,0,0,0.35);
}
.tiastvisual .tiastvisual-word{
                               color: #FFFFFF;
                               position: absolute;
                               top:35%;
                               left: 20%;
                               line-height: 2.8rem;
                               text-shadow: 0 3px 1px #000;
}
.tiastvisual .tiastvisual-word h2{
                                  margin-bottom: 20px;
}
/* --------------------------タイアスト　main -------------------*/
.main-tiast {
            width: 100%;
            margin-top: 50px;
}
.main-tiast .ability-img{
                         text-align: center;
                         margin: 70px 0 100px
}
.main-tiast .sec1-tiast img{
                             filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.1));
}
.main-tiast .sec2-tiast img,.main-tiast .sec3-tiast img, .main-tiast .sec4-tiast img{          
                             filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.4));
}
.main-tiast .sec5-tiast img,.main-tiast .sec6-tiast img{          
                             filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.2));
}
.main-tiast .sec7-tiast img{          
                             box-shadow: 0 2px 2px 2px rgba(3,3,3,0.1);
}
.main-tiast .sec8-tiast img{
                            filter: drop-shadow(2px 2px 3px rgba(0,0,0,0.4));
}
.sec-tiast .ability-ttl{
                        margin: 30px 30px 30px ;
                        padding-bottom: 10px;
                        border-bottom: solid 1px rgba(0,0,0,0.4);
                        box-shadow: 0 1px 0 rgba(255,255,255,1);
}
.sec-tiast .ability-ttl .tiast-no{
                                  font-size: 4rem;
                                  margin-right: 20px;
                                  margin-left: 20px;
                                  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}
.sec-tiast .ability-exp{
                        margin: 20px 0 50px 90px ;
}
.main-tiast .sec8-tiast .sosiki{
                                width: 100%;
                                margin: 20px auto 150px;
                                display: flex;
                                justify-content: center;
}
.main-tiast .sec8-tiast .sosiki .sosiki-ex{
                                            width: 250px;
                                            margin-right:  20px ;
}
@media screen and (max-width:760px){
    
    .main-tiast {
                 margin-top: 30px;
}
    .tiastvisual{
                display: flex;
                justify-content: center;
    }
.tiastvisual .tiastvisual-word{
                                top:32%;
                                left:10%;
                                margin-right: 10%;
                                line-height: 2.8rem;                          
}
   .tiastvisual .tiastvisual-word h2{
                                     margin-bottom: 10px;
} 
    .main-tiast .ability-img{
                             margin: 30px 0 100px
}
    .main-tiast .ability-img img{
                                  width: 90%;
                                  margin: 10px 0 10px;
}
    .sec-tiast .ability-ttl{
                        margin: 20px 10% 20px ;
                       line-height: 3rem;
}
    .sec-tiast .ability-ttl .tiast-no{
                                      font-size: 3rem;
                                      margin-right: 10px;
                                      margin-left: 0;
}
    .sec-tiast .ability-exp{
                            width: 90%;
                            margin: 0 auto;
                            padding: 0 0 40px 0px ;
        line-height: 2.5rem;
}
    .main-tiast .sec8-tiast .sosiki{
                                width:90%;
                                margin:0 auto 150px;
                               flex-wrap: wrap;
}
.main-tiast .sec8-tiast .sosiki .sosiki-ex{
                                            width: 100%;
                                            height: auto;
                                            margin-right:  0 ;
                                            margin-bottom: 20px;
}
    .main-tiast .sec8-tiast .sosiki img{
                                        display: block;
                                        width: 70%;
    }
}
/*--------------------------------------------------------------------------------------- product ---------*/
.main-product{
              width: 90%;
              height: auto;
              margin: 0 auto;
}
.productvisual{
              width: 100%;
              height: 300px;
              background:url("img/product/pro10.jpg"); 
              position: relative;
              box-shadow: 0px 3px 6px rgba(0,0,0,0.35);
}
.main-product .sec-product{
                           width: 90%;
                           height: auto;
                           margin: 0 auto;
}
.productvisual .mid-word{
                       width: 100%;
                       color: #fff;
                       position: absolute;
                       top:51%;
                       text-align: center;
                       line-height: 2.8rem;
                       text-shadow: 0 3px 1px #000;
}
.abouttvisual .mid-word h2{
                            margin-bottom: 25px;
                            text-shadow: 0 2px 1px #000;
}
.main-product .sec-product .product-ttl{
                                        margin: 30px 0 30px ;
                                        font-size: 2rem;
                                        padding-bottom: 10px;   
                                        border-bottom: solid 1px rgba(0,0,0,0.4);
                                        box-shadow: 0 1px 0 rgba(255,255,255,1); 
}
.main-product .sec-product .product_p{
                                      line-height: 2.7rem;
}
.main-product .sec-product .p-Menu{
                                    width: 100%;
                                    display: flex;
                                    justify-content:center;
                                    margin: 70px 0 50px;
}
.main-product .sec-product .p-Menu li{
                                       width: 33.3%;
                                       font-size: 1.4rem ;
                                       background-color: rgba(126,124,124,1);
                                       padding: 0.6rem ;
                                       text-align: center;
                                       border-right: 1px solid rgba(189,189,189,1.00);
}
.main-product .sec-product .p-Menu li:last-of-type{
                                                    border-right: none;
}
.main-product .sec-product .p-Menu li:hover{
                                            background-color: #9F0103;
}
.main-product .sec-product .p-Menu li a{
                                        color: #fff;
                                        padding: 1rem 4rem;
}
.main-product .sec-product .viw-waku{
                                     display: flex;
                                     justify-content: center;
                                     margin: 30px 0 100px;
}

.main-product .sec-product .p-Contents{
                                        
                                        height:auto;
                                        margin: 0 auto;
}
.main-product .sec-product .p-Contents h3{
                                          width: 100%;
                                          margin: 100px auto 70px;                            
                                          text-align: center;
                                          background-color: #9F0103;
                                          padding: 1rem 0;
                                          color: #fff;
                                          font-size: 1.7rem;
}
.main-product .sec-product .viw-waku figure{
                                            margin-right: 14%;
}
.main-product .sec-product .viw-waku ul{
                                        margin-top: 3.5rem;
}

@media screen and (max-width:760px){
                                    
     .main-product .sec-product .tabMenu{
                                         flex-direction: column;
                                         width: 100%;
     
}
    .main-product .sec-product .tabMenu li{
                                           width: 80%;
                                           padding: 1rem 0;
                                           margin: 0.2rem auto;
} 
    .main-product .sec-product .tabMenu li .tab{
                                                padding: 1.3rem 26%;
    }
    .main-product .sec-product #tabContents{
                                        width: 100%;
                                        height:auto;
}
    .main-product .sec-product .viw-waku{
                                         margin: 0px 0 100px;
}
    .main-product .sec-product .p-Contents h3{
                                              margin: 100px auto 30px;                            
}
    .main-product .sec-product .viw-waku figure{
                                                 width: 100%;
                                                 margin-right: 1%;
                                                 margin-top: 0;
}
    .main-product .sec-product .viw-waku figure img{
                                                    width: 95%;
    }
    main-product .sec-product .viw-waku ul{
                                           margin-top: 0rem;
}
    .main-product .sec-product .p-Menu{
                                       flex-direction: column;
                                        margin: 50px 0 0;
}
.main-product .sec-product .p-Menu li{
                                       width: 100%;
                                       margin-bottom: 0.5rem;
                                       border-right: 0;
}
}
/* ----------------------------------------------------------------------------------- about us ---------- */
.abouttvisual{
              width: 100%;
              height: 300px;
              background:url("img/about/sky07.jpg");
              position: relative;
              box-shadow: 0px 3px 6px rgba(0,0,0,0.35);
}
.abouttvisual .mid-word{
                       width: 100%;
                       color: #fff;
                       position: absolute;
                       top:51%;
                       text-align: center;
                       line-height: 2.8rem;
}
.abouttvisual .mid-word h2{
                            margin-bottom: 25px;
                            text-shadow: 0 2px 1px #000;
}
.main-about .sec-about .about-ttl{
                                  margin: 30px 10% 30px ;
                                  font-size: 2rem;
                                  padding-bottom: 10px;
                                  border-bottom: solid 2px rgba(0,0,0,0.4);
                                  box-shadow: 0 1px 0 rgba(255,255,255,0.8);
}
.main-about .sec-about{
                       margin-bottom: 60px;
}
.main-about .sec-about img{
                           margin-right: 20px;
                           vertical-align: bottom;
}
.main-about .sec-about h3{
                          margin: 50px auto 60px;
                          text-align: center;
                          color: #fff;
                          width: 250px;
                          padding: 1rem 1rem;
                          background: -moz-linear-gradient(#ffb03c,#ff708d);
                          background: -webkit-linear-gradient(#ffb03c,#ff708d);
                          background: linear-gradient(to right,#ffb03c,#ff708d);
                          box-shadow: 0 2px 2px 2px rgba(0,0,0,0.1);
}
.main-about .sec-about p{
                         width: 80%;
                         margin: 0 auto;
                         line-height: 2.5rem;
}
.main-about .sec-about .bussiness{
                                  margin-left: 10%;
                                  line-height: 3.5rem;
                                  font-size: 1.6rem;
}
.pad10{
       padding:0  20px 0 10px;
}
.main-about .sec-about .teian{
                              margin-bottom: 50px;
}
.main-about .sec-about .koutei{
                               width: 100%;
                               display: flex;
                               justify-content:center;
                               margin-bottom:  60px;                           
}
.main-about .sec-about .koutei li{
                                  font-size: 1.3rem;
                                  color: #494949;
                                  text-align:center;
                                  padding-bottom: 30px;
                                  align-self:flex-end;
}
.main-about .sec-about .step{
                             display: block;
                             text-align:center;
                             font-size: 3rem;
                             padding: 10px 10px 10px;
                             margin-bottom: 30px;
}
.main-about .sec-about .koutei-no{
                                  display: flex;
                                  justify-content: center;
}
.main-about .sec-about .koutei-no li{
                                     width: 8.2%;
                                     padding: 0 25px 15px;
                                     text-align: center;
                                     font-size: 1.2rem;
}
.main-about .sec-about .koutei .koutei-ex{
                                          display: block;
                                          text-align:center;
                                          padding-top: 25px;
                                          font-size: 1.6rem;
}
.main-about .sec-about .koutei img{
                                   filter: drop-shadow(2px 2px 3px rgba(0,0,0,0.4));
                                    padding: 0 15% 35px;
                                    border-bottom: 3px solid #ff708d;
}
.main-about{
            margin-bottom: 150px;
}
.main-about .sec-about .koutei-box{
                                   width: 85%;
                                   margin: 0 auto 60px;
                                   border: solid 4px ;
                                   border-image:linear-gradient(90deg,#ffb03c,#ff708d);
                                   border-image-slice: 1;                              
}
.main-about .sec-about .fin{
                            text-align: center;
                            width: 250px;
                            margin: 0 auto 100px;
                            padding: 1rem 1rem;
                            background: -moz-linear-gradient(#ffb03c,#ff708d);
                            background: -webkit-linear-gradient(#ffb03c,#ff708d);
                            background: linear-gradient(to right,#ffb03c,#ff708d);
                            color: #fff;
                            box-shadow: 0 2px 2px 2px rgba(0,0,0,0.1);
}
.main-about .sec-about .triangle{
                                 width: 0;
                                 height: 0;
                                 border-left: 20px solid transparent;
                                 border-right: 20px solid transparent;
                                 border-top: 20px solid #ff708d;
                                 margin: 0 auto 50px;
}
.main-about .sec-about .pack{            
                             display: flex;
                             justify-content: center; 
                             margin-bottom: 100px;
}
.main-about .sec-about .pack p{
                               margin-right: 30px;
                               margin-top: 10px;
                               font-size: 1.6rem;
}
.main-about .sec-about .pack img{
                                 padding-left: 30px;
}
.main-about .sec-about .nouki{
    width: 80%;
    margin: 0 auto;                   
}
.main-about .sec-about .nouki p{
                              line-height: 3rem;
}
@media screen and (max-width:760px){
    
    .main-about .sec-about{
                           margin-bottom: 40px;
}
    .main-about .sec-about .bussiness{
                                      width: 80%;
                                      display: block;
                                      margin: 0 auto;
}
    .main-about .sec-about .koutei-box{
                                       width: 90%; 
        margin-bottom: 50px;
        padding-bottom: 20px;
    }
    .main-about .sec-about .koutei-box .sp_koutei{
                                                  display: flex;
                                                  justify-content: center;
    }
    .main-about .sec-about .koutei-no{
                                      width:30%;
                                      margin:  0 auto;
                                      flex-direction: column;
}
.main-about .sec-about .koutei-no li{
                                     padding: 11px 10% 20px 40%;
                                     text-align: center;
}
    .main-about .sec-about .koutei{
                                   width: 30%;
                                   margin: 0 18% 0 10%;
                                   flex-direction: column;
                                   margin-bottom:  0px;                           
}
.main-about .sec-about .koutei li{
                                  padding-bottom: 20px;
                                  align-self:flex-end;
}
    .main-about .sec-about .koutei  img{
                                         transform: scale(0.7);
                                         padding: 0 15% 5px;
    }
    .main-about .sec-about .koutei .koutei-ex{
                                             padding-top: 5px;
}
    .main-about .sec-about .triangle{
                                     margin: 0 auto 40px;
    }
    .main-about .sec-about .fin{
                                margin: 0 auto 50px;
    }
    main-about .sec-about .pack{            
                                margin-bottom: 20px;
}

}
/*------------------------------------------------------------------------ contact ---------*/
.contactvisual{
              width: 100%;
              height: 300px;
    background:url("img/contact/clover3.jpg");
             /* background-color: #FEE8F0;*/
              position: relative;
              box-shadow: 0px 3px 6px rgba(0,0,0,0.35);
     background-color: rgba(0,0,0,0.2);
    background-blend-mode:darken;
}
.contactvisual .mid-word{
                       width: 100%;
                       position: absolute;
                       top:37%;
                       text-align: center;
                       line-height: 2.8rem;
                       color: #fff;
                       text-shadow: 0 1px 1px #000;
}
.contactvisual .mid-word h2{
                            margin-bottom: 25px;
}
.main-contact .sec1-contact .contact-ttl{               
                                         font-size: 2rem;
                                         padding-bottom: 30px;

}
.main-contact .sec2-contact .contact-ttl{
                                         font-size: 2rem;
                                         padding-bottom: 7px;
                                         border-bottom: solid 1px rgba(0,0,0,0.4);
                                         box-shadow: 0 1px 0 rgba(255,255,255,1);
                                         margin-bottom: 20px;
}
.main-contact p{
                line-height: 2.7rem;
}
.main-contact .sec1-contact{
                            text-align:center;
                            margin: 70px auto 100px;
                            width: 40%;
}
.main-contact .sec2-contact{
                            display: flex;
                            justify-content:center;
                            margin-bottom: 100px;
}
.main-contact .sec1-contact .sec1box{
                                     position: relative;
                                     padding:  4rem 0.7rem;
                                     margin: 2rem 0;
                                     background: linear-gradient(to right,#ffb03c,#ff708d);
                                     color: #fff;
                                     border-radius: 30px;
                                    font-weight: bold;
                                    letter-spacing: 0.1rem;
}
.main-contact .sec1-contact .no{
                                margin-right: 20px;
}
.main-contact .sec1-contact p{
                              text-align: left;
                              padding-left: 15%;
}
.main-contact .sec1-contact .sec1box:after{
                                           position: absolute;
                                            content: "";
                                            top:100%;
                                            left:46%;
                                            border: 15px solid transparent;
                                            border-top: 15px solid #FF8F65;;
                                            width: 0;
                                            height: 0;
}
.main-contact .sec1-contact img{
                                margin: 40px 0 0 10px;
}
.main-contact .sec2-contact .access{
                                    margin-right: 50px;
}
.main-contact .sec2-contact .access address{
                                            font-size: 1.6rem;
}
.main-contact .sec2-contact .map{
                                 border: 5px solid #919090;
                                 box-shadow: 0px 2px 6px rgba(0,0,0,0.2);
}
.main-contact .sec2-contact .sp_map{
                                    display: none;
}
@media screen and (max-width:760px){
    
    .main-contact{
                  width: 100%;
    }
    .main-contact .sec1-contact{
                                width: 95%;
                                margin: 50px auto 70px;
}
    .main-contact .sec1-contact p{
                              text-align:center;
                              padding-left: 0;
}
    .main-contact .sec1-contact .no{
                                    margin-right: 10px;
}
    .main-contact .sec2-contact{
                                width: 95%;
                                margin: 0 auto ;
                                flex-direction: column;
                                margin-bottom: 130px;
}
    .main-contact .sec2-contact .access{
                                        width: 90%;
                                        margin-right: 0;
}
.main-contact .sec2-contact .map{
                                 display: none;
}
    .main-contact .sec2-contact .sp_map{
                                        display:block;
                                        margin: 5px auto;
                                        border: 5px solid #919090;
                                        box-shadow: 0px 2px 6px rgba(0,0,0,0.2);
}
}

/* ----------------------------------------- footer */
#footer{
        height: 230px;
        width: 100%;
        background-color: #1B1B1B;
        display: flex;
        justify-content:center;
        align-items: flex-end;
        box-shadow: 0px -3px 4px rgba(0,0,0,0.35);
        position: relative;
    }
#footer small{
              margin-bottom: 30px;
              color: #fff;
              font-size: 1.4rem;
}
#footer p{
          font-size: 1.6rem;
}
#footer .back-to-top{
                     position:absolute;
                     right: 15px;
                     top: -120px;
                     transition: 0.3s;
}
#footer .back-to-top:hover{
                          transform: rotate(5deg);
                           cursor:pointer;
}
#footer .cominix a{
                   color: #FFFFFF;
                   position: absolute;
                   left: 20px;
                   top:25px;
                   font-size: 1.4rem;
}
#footer .cominix .cominix1{
                           padding-left: 15px;
}
#footer .seto a{
                 color: #FFFFFF;
                 position: absolute;
                 left: 20px;
                 top:62px;
    font-size: 1.4rem;
}
#footer .m-r15{
               margin-right: 15px;
}
@media screen and (max-width:760px){
    
    #footer{;
            height: 230px;
            width: 100%;
    }
    #footer p{
              font-size: 1.4rem;
    } 
    #footer .back-to-top{
                         right: 0;
                         top: -110px; 
}
    #footer .back-to-top img{
                             transform: scale(0.7);
    }
    
    
    
    
    
}