@charset "UTF-8";
/*
Theme Name: media
Theme URI: https://media.konankigyo.com
Author: the WordPress team
*/
html,body{
   margin: 0;
   font-size: 1.1rem;
}
ul{
   list-style: none;
   padding: 0;
   margin: 0;
}
h1{
   margin: 0;
}
h2,h3,h4{
   margin-top: 1%;
   text-align: center;
}
h2{
   margin-bottom: 5%;
}
h3{
   margin-bottom: 3%;
}
p{
   margin: 0;
}
a{
   text-decoration: none;
   color: rgb(60,60,60);
}
section{
   padding: 2% 3%;
}
video{
   width: 100%;
   vertical-align: bottom;
}
.wrapper{
   max-width: 1280px;
   width: 95%;
   margin: 0 auto;
}
.bg_color_gray{
   background-color: #f5f5f5;
}
.tel_icon{
   width: 30px;
   height: 30px;
   margin-right: 5px;
}
.br480_under_block{
   display: none;
}
#kounan_kg_icon{
   position: absolute;
   left: 1vw;
   top: 1vw;
 }
.top-image {
   position: relative;
   /* width: 100%; */
   height: 0;
   /* padding-top: 47.29%; */
   padding-top: 45%;
   background-position: center;
   background-repeat: no-repeat;
   background-size: 100% auto;
}
.media-top-img{
   background-position: 0 55%;
}

#media_text{
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   text-align: center;
   color: white;
   text-shadow: 3px 3px 3px black;
   font-size: 2.5vw;
   padding-bottom: 5%;
 }

#thought_wrapper{
   display: flex;
   justify-content: space-around;
}

#thought_wrapper > li:nth-of-type(2){
   position:relative;
   
   /* border-top: 3px double rgb(242, 201, 79); */
   /* border-bottom: 3px double rgb(242, 201, 79); */
   /* border-top: 3px double rgb(242, 201, 79); */
   border: 3px double rgb(242, 201, 79);
}

#thought_wrapper > li{
   width: 48%;
}

#thought_text{
   text-align: center;
   line-height: 3.5vw;
   font-size: 1.3vw;
   width: 100%;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   padding: 3px 0;
}
#contact_info a{
   line-height: 2rem;
   display: flex;
   justify-content: center;
   align-items: center;
   /* border: 2px solid rgb(242, 201, 79); */
   background-color: rgb(66, 187, 74);
   width: fit-content;
   border-radius: 10px;
   padding: 3px 10px;
   margin: 10px auto 0;
   color: rgb(255,255,255);
}

#instagram_wrapper{
   max-width: 896px;
   margin: 0 auto;
}

#line_wrapper a{
   width: fit-content;
   margin: 0 auto;
   display: flex;
   justify-content: center;
}
#line_wrapper a:hover{
   opacity: 0.8;
}
.LINE_Brand_icon{
   width: 100px;
   height: 100px;
}
#line_wrapper p{
   margin-left: 55px;
   line-height: 2rem;
   font-size: 1rem;
}

#footer{
   background-color: #333;
   color: #fff;
   text-align: center;
   height: 70px;
   position: relative;
   padding: 3% 0;
}


.link{
   text-align: center;
   position: absolute;
   /* 中央寄せ */
   top: 50%;
   left: 50%;
   transform: translateY(-50%);
   transform: translateX(-50%);
 }
 
 .link a {
   position: relative;
   font-size: 16px;
   font-weight: 600;
   line-height: 1em;
   border: solid 1px #FFF;
   border-radius: 20px;
   padding: 5px 35px 5px 15px;
   /* background-color: rgb(84, 130, 53); */
   /* color: white; */
   background-color: white;
   color: rgb(60,60,60);
   text-decoration: none;
 }
 
 .link a::after {
   position: absolute;
   content: '';
   background-repeat: no-repeat;
   background-size: cover;
   width: 15px;
   height: 15px;
   top: 9px;
   /* left: calc(50% - -42px); */
   right: 15px;
 }

 
@media screen and (min-width: 1380px){   
   #thought_text{
      font-size: 1.2rem;
      line-height: 3rem;
   }
}

 @media screen and (max-width: 1024px){
   #kounan_kg_icon img{
      width: 30vw;
   }
}

@media screen and (max-width: 896px){   
  .top-image {
      padding-top: 80%;
      background-size: cover;
   }   
   .media-top-img{
      background-position: 0 20%;
   }
   #media_text{
      font-size: 1.5rem;
      padding-bottom: 5%;
   }
   #thought_wrapper{
      flex-direction: column;
   }
   #thought_wrapper > li{
      width: 100%;
   }
   #thought_wrapper > li:nth-of-type(2){
      margin-top: 3%;
      position: static;
   }
   #thought_text{
      position: static;
      transform: none;
      line-height: 5vw;
      font-size: 2.5vw;
   }
   .LINE_Brand_icon{
      width: 12vw;
      height: 12vw;
   }
}


@media screen and (max-width: 480px){
   html,body{
      font-size: 3.33vw;
   }
   .tel_icon{
      width: 5vw;
      height: 5vw;
   }
   #media_text{
     text-shadow: 2px 2px 2px black;
     padding: 2% 2% 10% 2%;
     line-height: 2.3rem;
   }
   #kounan_kg_icon{
     left: 0;
     top: 0;
   }
   #kounan_kg_icon img{
     width: 60vw;
   }
   #thought_wrapper > li{
      width: 100%;
   }   
   #thought_text{
      line-height: 6.5vw;
      font-size: 3.7vw;
   }
   .LINE_Brand_icon{
      width: 18vw;
      height: 18vw;
   }
   #line_wrapper p{
      margin-left: 9vw;
   }
   #contact_info a{
      font-size: 1.2rem;
      border-radius: 1vw;
   }   
   .br480_under_block{
      display: block;
   }
   #footer{
      height: 70px;
   }   
}