@charset "utf-8";

/* body
------------------------------*/

body {
  background-color: #fff;
  width: 1280px;
  margin: 0 auto;
}

/* wrapper
------------------------------*/

.wrapper {
  width: 1280px;
  margin: 0 auto;
  background-color: #fff;
  position: relative;
  /* padding-bottom: 120px; */
  /*←footerの高さ*/
  /* box-sizing: border-box; */
  /*←全て含めてmin-height:100vhに*/
  /* min-height: 100vh; */
}

/* header
------------------------------*/

/* header {
  padding: 10px 20px 10px;
  background-color: #fff;
} */

/* logo */
.logo {
  display: flex;
  justify-content: center;
  margin-top: 50px;

}


.main_img {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}



/* nav
------------------------------*/

nav {

  margin-top: 25px;

  display: flex;
  justify-content: center;
  margin-left: 40px;

}



nav.global ul li {
  display: inline-block;
  font-size: 1.5em;
  margin-right: 40px;


}

nav ul li a {
  color: #1f1e1e;
  text-decoration: none;
  font-weight: bold;
}

nav ul li a:hover {
  text-decoration: underline;
  color: #4e5459;
  transform: scale(2, 2);
  transition-duration: 0.2s;
}

/* ページ毎ごとのナビ設定 */

.search nav.global li:nth-child(1) a span, .concept nav.global li:nth-child(2) a span, .news nav.global li:nth-child(3) a span, .company nav.global li:nth-child(4) a span, .join_us nav.global li:nth-child(5) a span, .recruit nav.global li:nth-child(6) a span {
  color: #4e5459;
  border-bottom: 2.5px solid #000;
}

/* header_top */
.top h1 {
  font-size: 1em;
  text-align: center;
  color: #4e5459;
  margin-top: 25px;
}

/* footer
------------------------------*/

footer {
  text-align: center;
 
clear: both;
height: 300px;
margin-top: 100px;
background-color: #d6d1d1;

}

.logo_fotter{
  margin-top: 30px;
}

.sns{
  margin-top: 30px;
}



/* .search_box input {
  float: left;
}

input.search_box {
  font-size: 3em;
  width: 450px;
  height: 60px;
  padding: 10px;
  font-size: 20px;
  border: solid 2px #cccccc;
  border-radius: 5px;
}


input.orange_btn {
  width: 200px;
  height: 58px;
  font-size: 1.5em;
  color: #fff;
  display: inline-block;
  text-align: center;
  background-color: #f78f08;
  border: 1px solid #f78f08;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  margin-left: 15px;
}

input.orange_btn:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 1s;
  /* transform: scale(1.02, 1.02);
  transition-duration: 0.2s; */
/* }

.seachbtn_usual {
  width: 150px;
  height: 50px;
  font-size: 1em;
  color: #fff;
  display: inline-block;
  text-align: center;
  background-color: #f78f08;
  border: 1px solid #f78f08;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  margin-left: 60px;
}

.seachbtn_usual:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 1s;

}


.resetbtn_usual {
  font-size: 1em;
  width: 150px;
  height: 50px;
  padding: 10px;
  font-size: 20px;
  border: solid 2px #cccccc;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  display: inline-block;
  text-align: center;
  margin-left: 50px;
  margin-bottom: 100px;
}

.resetbtn_usual:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
}

.search_box_usual {
  font-size: 1em;
  width: 500px;
  height: 60px;
  padding: 10px;
  font-size: 20px;
  border: solid 2px #cccccc;
  border-radius: 5px;
  margin-bottom: 50px;
  margin-left: 60px;
}

.seachbtn_usual_last {
  width: 150px;
  height: 50px;
  font-size: 1em;
  color: #fff;
  display: inline-block;
  text-align: center;
  background-color: #f78f08;
  border: 1px solid #f78f08;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  margin-left: 60px;
  margin-bottom: 50px;
}

.seachbtn_usual_last:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 1s;
}

.resetbtn_usual_last {
  font-size: 1em;
  width: 150px;
  height: 50px;
  padding: 10px;
  font-size: 20px;
  border: solid 2px #cccccc;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  display: inline-block;
  text-align: center;
  margin-left: 50px;
}

.resetbtn_usual_last:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
} */


/* main */
main{
  margin-bottom: 50px;
}

/* Top */

.top h2 {
  margin-top: 60px;
  margin-left: 100px;
  font-size: 1.5em;

}


.top h3 {
  margin-top: 40px;
  margin-bottom: 30px;
  margin-left: 100px;
  font-size: 1.5em;
}

.top h4 {

color: #fff;
  font-size: 1.25em;

font-weight: bold;
}


/* スタイル紹介 */
.style_container1{
  margin-top: 40px;
  display: flex;
justify-content: space-evenly;  
}
.style_container2{
  display: flex;
justify-content: space-evenly;  
margin-top: 50px;
margin-bottom: 100px;
}
.basic_index{
border-radius: 50%;

}
.basic_index:hover {
  transform: scale(1.05, 1.05);
  transition-duration: 0.2s;
}
.feminine_index{
  border-radius: 50%;
  }
  .feminine_index:hover {
    transform: scale(1.05, 1.05);
    transition-duration: 0.2s;
  }
.sporty_index{
  border-radius: 50%;
  }
  .sporty_index:hover {
    transform: scale(1.05, 1.05);
    transition-duration: 0.2s;
  }
  .neon_index{
    border-radius: 50%;
    }

    .neon_index:hover {
      transform: scale(1.05, 1.05);
      transition-duration: 0.2s;
    }
.index_title{
  text-align: center;
  font-size: 1.3em;
  font-weight: bold;
}



.worries_intro{
 margin-top: 10px;
  margin-bottom: 30px;
  margin-left: 100px;
  font-size: 1.2em;
}

.worries_container {
  display: flex;
  justify-content: space-evenly;


}

.dairy {

  border-radius: 30px;
  width: 300px;
  height: 100px;
  text-align: center;

  background-color: #3fa9f5;

}

.fashion {

  border-radius: 30px;
  width: 350px;
  text-align: center;
  background-color: #3fa9f5;

}

.charactor {

  border-radius: 30px;
  width: 350px;
  text-align: center;
  background-color: #3fa9f5;
}

.top h4 {
  padding-top: 30px;
}
.down{
  height: 130px;
  background-image: url(../shine_img/down.google.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 350px;
  margin-top: 50px;
}
.promise {
  display: flex;
  justify-content: center;
 


}

.promise p {
  font-weight: 600;
  font-size: 1.55em;
  text-align: center;
  margin-top: 50px;
  background-color: #f39223b4;
  width: 800px;
  height: 60px;
  border-radius: 10px;
  padding-top: 30px;


}

/* custmers voice */
.custmoers_voice h3{
  margin-top: 80px;
  margin-bottom: -50px;
}
.customers_container{
  display: flex;
  justify-content: space-evenly;
margin-top: 100px;
margin-left: 60px;
}

.ksan_box{
  width: 350px;
  border:1px dotted #4e5459;
  height: 800px;
  border-radius: 5px;
background-color: #f8edcca9;
}

.ksan_text{
  background-image: url(../shine_img/womanicon2.png);
  background-repeat: no-repeat;
font-size: 1em;

}
.ssan_box{
  width: 350px;
  border:1px dotted #4e5459;
  height: 800px;
  border-radius: 5px;
  background-color: #f8edcca9;
}
.ssan_text{
  background-image: url(../shine_img/womanicon2.png);
  background-repeat: no-repeat;
font-size: 1em;

}
.nsan_box{
  width: 350px;
  border:1px dotted #4e5459;
  height: 800px;
  border-radius: 5px;
  background-color: #f8edcca9;
}
.nsan_text{
  background-image: url(../shine_img/womanicon2.png);
  background-repeat: no-repeat;
font-size: 1em;

}
.customer_title{
  padding-left: 120px;
  font-size: 1em;
  padding-top: 20px;
}

.customer_text{
  margin-top: 40px;
  margin-bottom: 50px;
  padding-left: 5px;
}




.beforephoto_container {
  display: flex;
  justify-content: space-evenly;
  border: 1px solid red;
  margin-top: 50px;
}



.customer_container {
  display: flex;
  justify-content: space-evenly;
  border: 1px solid red;
}
.office_before {

  padding-left: 20px;
  }
  
  .travel_before {
    padding-left: 20px;
    
  }
  
  .live_before {
    padding-left: 20px;
  }
.office {

  margin-left: 80px;
}

.travel {

  margin-left: 80px;
}

.live {
  
  margin-left: 80px;
}


.before{
  font-size: 0.9em;
  padding-left: 5px;
  margin-bottom: 20px;
}

.after{
  font-size: 0.9em;
  padding-left: 5px;
}




/* Collection */
.collection h1 {
  margin-top: 50px;

  font-size: 2em;
  margin-left: 100px;
}

/* collection nav */
.collection_nav {
  margin-top: 50px;

  display: flex;
  justify-content: center;
  margin-left: 40px;

}

.collection_nav ul li {
  display: inline-block;
  font-size: 1.4em;
  margin-right: 40px;

}

.collection_nav ul li a {
  color: #1f1e1e;
  text-decoration: underline;
  font-weight: bold;
}

.collection_nav ul li a:hover {
  text-decoration: underline;
  color: #4e5459;
  transform: scale(2, 2);
  transition-duration: 0.2s;
}


.collection h2 {
  margin-bottom: 20px;
  text-decoration: underline #000;
  font-size: 1.8em;
  color: #000;
}


/* basic style */
.basicbox {
  margin-left: 150px;

  width: 1280px;
  height: 350px;
  float: left;
  margin-top: 90px;
}

.basic {
  float: left;
}

.basic_text {
  float: right;
  margin-top: 50px;
  margin-right: 400px;
}



/* feminine style*/
.femininebox {
  width: 1280px;
  height: 350px;
  float: right;
  margin-top: 30px;
  background-color: #f8edcca9;

}

.feminine {
  float: right;
  margin-right: 200px;
}

.feminine_text {
  float: left;
  margin-left: 100px;
  margin-top: 130px;
}

/* sporty style */

.sportybox {
  width: 1280px;
  height: 350px;



}

.sporty {
  float: left;
  margin-top: 80px;
  margin-left: 150px;
}

.sporty_text {
  float: right;
  margin-top: 130px;
  margin-right: 80px;
}

/* neon style */
.neonbox {
  width: 1280px;
  height: 350px;
  float: right;
  margin-top: 50px;
  background-color: #f8edcca9;
  margin-bottom: 100px;
}

.neon {
  float: right;
  margin-right: 200px;
}

.neon_text {
  float: left;
  margin-left: 150px;
  margin-top: 100px;
}

/* Fitting */


.fitting h1 {
  margin-top: 50px;

  font-size: 1.7em;
  margin-left: 100px;
}


.fitting h2{
  margin-top: 60px;
  margin-left: 100px;
  font-size: 1.4em;

}

.fitting_intr{
margin-top: 20px;
  margin-left: 100px;
  font-size: 1.15em;
  margin-bottom: 10px;
}
.fitting h3{
  margin-top: 50px;
  margin-left: 100px;
  font-size: 1.3em;
}

.fitting_box1 {
  display: flex;
  justify-content: space-evenly;

margin-top: 30px;
}

.fitting_box2 {

  display: flex;
  justify-content: space-evenly;

margin-top: 70px;
}

.fit_item{
  font-weight: bold;
  font-size:1.1em
}

.fit_detail{
  font-size: 1em;
}

/* access */
.access h1{
  margin-top: 50px;
  margin-left: 100px;
  font-size: 2em;

}
.access h2{
  margin-top: 50px;
  margin-left: 100px;
  font-size: 1.5em;
  padding-left: 30px;
margin-bottom: 20px;
}



.fitting_room{
  margin-left: 200px;
  margin-top: 30px;
  height: 300;
  width: 400;
  float:left;

}



.fitting_room_text{
float:left;
margin-left: 120px;
margin-top: 50px;
}

.fit_top{
  font-size: 1.5em;
  font-weight: bold;
}

.fit_detail{
  font-size: 1em;
  margin-top: 20px;
 
}
.fitting_map{
  margin-left: 700px;
  clear: both;
  margin-top:350px;
  margin-bottom: 30px;

}

.main_access {
  margin-top: 100px;
  height: 300;
  width: 400;
  float:left;

}

.main_office{
  margin-left: 200px;
  float:left;
margin-top: 50px;
}

.main_office_text{
  float:left;
  margin-left: 150px;
  margin-top: 50px;

}
.main_top{
  font-size: 1.5em;
  font-weight: bold;
}

.main_detail{
  font-size: 1em;
  margin-top: 20px;
}
.main_office_map{
  margin-left: 700px;
  clear: both;
  margin-top:350px;
  margin-bottom: 80px;
}

/* Philosophy */
.philosophy h1{
  margin-top: 50px;
  margin-left: 100px;
  font-size: 1.7em;

}

.philosophy h2{
  margin-top: 50px;
  margin-left: 100px;
  font-size: 1.45em;
  clear: both;
}

.philosophy h3{
margin-top: 20px;
  margin-left: 100px;
  font-size: 1.4em;
}

.color_challenged{
  /* background-color: #f8edcca9; */
  width: 700px;
}

.color_challenged h2{
margin-left: 100px;

} 

.philosophy_top_container{
  display: flex;
  justify-content: center;
}
.setglass_img{

  border-radius: 10px;


}

/* .color_challenged{
  width: 700px;
  height:500px;
  border:1px blue solid;
} */
.color_challenged_text{

  margin-left: 100px;
  font-size: 1.1em;
  margin-bottom: 20px;
}
.colorfuleye{
  float: right;
  margin-top: -200px;
 margin-right: -400px;
}
.enjoywoman{
  margin-left: 150px;
  margin-top: 150px;

}
.shine_philosophy_text{
float: right;
margin-top: 130px;
margin-right: 80px;
}

.philosophy strong{
  font-weight: 600;
  /* color: rgb(30, 62, 245); */
  line-height: 1.75em;
}


/* .color_challenged_text_shine{
  
  margin-left: 100px;
  font-size: 1.1em;
  margin-bottom: 20px;
  line-height: 2em;
} */

.security{
  margin-left: 15px;
  /* border:1px solid red; */
  /* width: 800px;
  height:200px; */
  /* background-color: #f8edcca9; */
  margin-top: 50px;
}

.lens{
  margin-left: 100px;
  font-size: 1.1em;
  margin-bottom: 20px;
  /* background-color: #f8edcca9; */
  /* border:1px solid blue;
  width: 600px;
height: 300px; */
}

.test{
  margin-left: 100px;
  font-size: 1.1em;
  margin-bottom: 20px;
  /* background-color: #f8edcca9; */
  /* border:1px solid blue;
  width: 600px;
height: 300px; */
}
.security_text{
  width: 700px;
  height: 1000px;
  border: 1px solid blue;
}
.saionji{
margin-left: 100px;
float: left;
/* width: 700px;
height: 300px; */
}
/* .saionjibox{
border: 1px solid green;
width: 700px;

} */
.saionji_text{
  float: left;
  font-size: 1.15em;
  margin-left: 50px;

  
}
.line{
  display: block;
  margin-top: 10px;
}

.testbox{
  /* border: 1px solid red; */
  width: 700px;
  height: 250px;
  margin-top: 50px;
/* margin-right: 30px; */
float: right;
}
/* contact */
.contact h1{
  text-align: center;
  height: 500px;
  margin-top: 100px;
}

/* Application */
.application h1{
  margin-top: 30px;
  margin-left: 100px;
  font-size: 1.7em;
}

/* contact_box */

.contact_text {
  margin-top: 30px;
}

.contact th, td {
  font-weight: 500;
  border: 0px none;
  font-size: 1.18em;
}

.contact th {
  width: 160px;
  padding: 15px;
  font-weight: 600;
}

.contact td {
  width: 250px;
  padding: 15px;
}

.contact_box {
  width: 400px;
  height: 30px;
}

.contact_textbox {
  width: 400px;
  height: 90px;
  margin-bottom: 30px;
}

.contact_submitbtn {
  width: 150px;
  height: 50px;
  font-size: 1.5em;
  color: #fff;
  font-weight: bold;
  display: inline-block;
  text-align: center;
  background-color: #f78f08;
  border: 1px solid #f78f08;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  margin-left: 450px;
  margin-top: 50px;
}

.contact_submitbtn:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 1s;
}

.contact_resetbtn {
  font-size: 1.5em;
  width: 150px;
  height: 50px;
  padding: 10px;
  font-size: 20px;
  border: solid 2px #cccccc;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  display: inline-block;
  text-align: center;
  margin-left: 50px;
  margin-bottom: 30px;
}

.contact_resetbtn:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
}

table{
  margin-left: 350px;
  width: 800px;
  margin-top: 50px;

}


th{
  font-size: 1.2em;
  margin-left: 300px;
  /* border: 1px solid blue; */
  line-height: 30px;

}

td{
  line-height: 50px; 

}



.date_box{
  width: 250px;
  height: 25px;
}

.time_box{
  width: 250px;
height: 25px;
}
.name_box{
  width: 250px;
height: 25px;

}
.tel_box{
  width: 250px;
height: 25px;

}
.email_box{
  width: 250px;
height: 25px;

}
.textbox{
  width: 250px;
height: 100px;
margin-top: 20px;
font-size: 1.15em;
padding-top: 5px;
}

.must{
  color: rgb(16, 108, 245);
  margin-left: 10px;
  font-weight: 500;
}

.booking_btn500{
  margin-left: 400px;

}

.booking_btn500:hover{
  transform: scale(1.05, 1.05);
  transition-duration: 0.2s;

}

.booking_btn500_top2{
  margin-top: 50px;
  clear:both;
  margin-left: 400px;

}

.booking_btn500_top2:hover{
  transform: scale(1.05, 1.05);
  transition-duration: 0.2s;
}
.booking_btn500_collection{
  margin-top: 150px;
  clear:both;
  margin-left: 400px;

}
.booking_btn500_collection:hover{
  transform: scale(1.05, 1.05);
  transition-duration: 0.2s;
}
.booking_btn500_fitting{
  margin-top: 50px;
  clear:both;
  margin-left: 400px;
 
}
.booking_btn500_fitting:hover{
  transform: scale(1.05, 1.05);
  transition-duration: 0.2s;
}

.booking_btn500_philosophy{
margin-top: 100px;
  clear:both;
  margin-left: 400px;

}
.booking_btn500_philosophy:hover{
  transform: scale(1.05, 1.05);
  transition-duration: 0.2s;
}
/* .booking_btn500_access{
  margin-top: 200px;
 
  margin-left: 400px;
} */

/* confirm.php */
.confirm h1{
  font-size: 1.7em;

  margin-top: 50px;
text-align: center;


  /* margin-left: 100px; */
}

.confirm_table{

  margin-right: 200px;
  /* display: flex;
 justify-content: center; */
 /* border: 1px solid green; */
}
.confirm_table tr{
  /* border: 1px solid blue; */
/* line-height: 150px; */
width: 200px;
  }
  

/* .confirm_table td{ */
/* border: 1px solid pink; */

/* } */


/* .confirm_table th{ */
  /* border: 1px solid red;  */
  /* width: 200px; */

  /* } */
/* .confirm_main{
  font-size: 1.2em;
  margin-left: 300px;
  /* border: 1px solid blue; */
  /* line-height: 30px;
}
.confirm_title{
 
  font-size: 1.1em;
}  */
.confirm_submitbtn {
  width: 150px;
  height: 50px;
  font-size: 1.5em;
  color: #fff;
  font-weight: bold;
  display: inline-block;
  text-align: center;
  background-color: #f78f08;
  border: 1px solid #f78f08;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  margin-left: 450px;
  margin-top: 50px;

}

.confirm_submitbtn:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 1s;
}
.confirm_backbtn{
  display: flex;
}
.contact_backbtn2 {
  font-size: 1.5em;
  font-weight: bold;
  width: 150px;
  height: 50px;
  padding: 10px;
  font-size: 20px;
  border: solid 2px #cccccc;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  display: inline-block;
  text-align: center;
  margin-left: 700px;
margin-top: -50px;

}


.contact_backbtn2:hover {
  color: #000;
  background-color: rgb(250, 150, 0);
  border: 2px solid #000;
  border-radius: 5px;
  cursor: pointer;
}
.back_topbtn_container{
  display: flex;
  justify-content: center;
  margin-top: 50px;
}
/* .back_topbtn:hover{


} */
/* .confirm_btn{
display: flex;
justify-content: center;
border: 1px solid red;
} */

/* .confirm_btn_container{
  display: flex;
justify-content: center;
} */

/* complete.php */
.complete h1{
  font-size: 1.75em;
  text-align: center;
  margin-top: 50px;
}

.complete strong{
  font-weight: bold;
}

/* .final{
  text-align: center;
} */

.complete li{
  font-size: 1.25em;
  margin-top:30px;
  line-height: 20px;
  text-align: center;
}

.compelte_text{
  font-size: 1.2em;
 margin-top:50px; 
  /* margin-left: 500px;  */
  line-height: 30px;
  font-weight: bold;
  /* display: flex;
  justify-content: center; */
  text-align: center;
}