@charset "UTF-8";

html{
  font-size: 12px;
  color: #111111;
}

body {
  margin: 0;
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 300;
  font-style: nomal;
}


/********************************

header

***********************************/

#wrapper{
    max-width: 1280px;
    position: relative;
    display: block;   
    margin: 0 auto;
    padding: 0;    
    background-color: grey;
}


header{
  max-width: 1280px;  
  position: fixed;  
  top: 0;  
  z-index:99999; 
  display: block;
  background-color: white;  
  width: 100%;
  height:100px;    
}

h1{
   width: 100%;
   height:100px; 
   padding: 0 30px 5px;    
}

h1:hover {
　opacity: 0.7;
　color: white;
}


img.rinoglassLogo{
   width: auto;
   height:95px;   
   padding:0 0 5px; 
}

img.rinoglassLogo:hover {
　opacity: 0.7;
}

p.menu{
  display: none;
}

nav.global{
  position: absolute;  
  top: 0;  
  right: 0;
  bottom: 0;
}

ul.global{
 text-align: right;
 padding:33px 50px 30px 0; 
}

li.global{
  font-family: 'Roboto', sans-serif;    
  display: inline-block;
  padding: 10px;
  margin: 0 10px;
}


a.globalMenu{
  font-family: 'Roboto', sans-serif;      
  font-size: 1.3em;
}



#hamburger_menu_icon{
  display: none;
}

#hamburger_menu_list{
  display: none;
} 

/********************************

main

***********************************/


#main{
  display: block;
  max-width: 1920px;
  width: 100%;
}

/* topimage */

.top{
  position: relative;
}

.TopImg{
  margin-top: 50px;
  display: block;  
  width: auto;  
  max-height: 600px;
  height:auto;
  background-color: black;
  overflow: hidden;  
}

img.topImg480{
  display: none;
}

p.catchCopy{
  position: absolute;
  z-index: 99;
  top: 45%; 
/*  center: 0;*/
/*  left: 15%;*/
  width: 100%;
  text-align: center;
  font-weight: 400;
  font-size: 3vw;
  color: white;
  letter-spacing: 1.2px;
  /*animation: top_p01 4s forwards;*/
  line-height: 1.6;
  margin: 15px 0px 10px;
  text-shadow: 2px 2px 2px rgb(0 0 0 / 50%);  
/*  font-family: 'Zen Kaku Gothic New', sans-serif;    */
}


/*contactTop*/


.contactImg{
  max-height: 300px;
  background-color: black;
  overflow: hidden; 
}

img.contactImg{
  width: 100%;  
  height: auto;  
  overflow: hidden;
  object-fit: cover; 
  object-position:0 -120px;   
}


/*BUSINESS*/


#businessTop{
    padding-top: 40px;
    margin-top: -40px;
}


section.outerLineBusiness{
  padding: 0;
  margin: 0;
  width: 100%;
  display: block; 
  background-color: white;
  background-image: url(../img/rinoglassTextile_1.jpg);
/*  background-position: right;
  background-position: top; */ 
  background-position: top right 0px;  
  background-size: 40%;
  background-repeat: no-repeat;  
}

.bottom_textile{
  padding: 0;
  margin: 0;
  width: 100%;
  display: block; 
  background-image: url(../img/rinoglassTextile_2.jpg);
/*  background-position: right;
  background-position: top; */ 
  background-position: left bottom 0px;  
  background-size: 40%;
  background-repeat: no-repeat; 
}

h2.title_nomove{ 
  display: block;
  margin: 0 20% 60px 0;
  padding: 80px 15% 0;
/*  border-bottom: solid thin;*/
}

/*.backs{
   float: left;  
}*/

/*img.back_1{
  float: left;  
}*/


h2.title{
  display: block;
  margin: 0 20% 60px 0;
  padding: 10px 15%;
}

span.bigTitle{
  font-family: 'Roboto', sans-serif;      
  display: inline;   
  font-size: 3vw;
  margin-right: 5%;
}

span.smallTitle{
  display: inline;  
  font-size: 1.5vw;
}

span.bigTitle_nomove{
  font-family: 'Roboto', sans-serif;      
  display: inline;   
  font-size: 3vw;
  margin-right: 5%;
}

span.smallTitle_nomove{
  display: inline;  
  font-size: 1.5vw;
}

span.bigTitle2{
  font-family: 'Roboto', sans-serif;      
  display: inline;   
  font-size: 3vw;
  margin-right: 5%;
}

span.smallTitle2{
  display: inline;  
  font-size: 1.5vw;
}

.innerLine{
  margin:0 15%;
  padding: 0 0 40px;
}

.innerLineContact{
  margin:0 20%;
  padding: 0 0 40px;
}

.eachBusiness{
  display: flex;
  flex-wrap: wrap;
}

article.business{
  margin-bottom: 50px;
  margin-right: 20%;  
  flex: 40%;
}

article.business:nth-child(even){
  margin-right: 0;
}

.circleImg{
  display: block;
  border-radius: 50%;
  width: 200px;
  height:200px;  
  margin: 0 auto;  
  overflow: hidden;
}

img.business_1{
  display: block;  
  width: 110%;
  height: 110%;
  object-fit: cover;  
  object-position: -130px -10px;  
}

img.business_2{
  display: block;  
  object-fit: cover;
  width: 100%;
  height:  100%;
  border-radius: 50%;  
  object-position: -50px 0px;  
}

img.business_3{
  display: block;  
  object-fit: cover;
  width: 110%;
  height: 110%;
  object-position: -60px 0px;  
}

img.business_4{
  display: block;  
  object-fit: cover;
  width: 110%;
  height: 110%;
  object-position: -50px -10px;  
}

h3.business{
  display: block;  
  margin: 20px 5% 20px 0;
  font-weight: bold;
  font-size: 1.8vw;
  text-align: center;
  font-family: 'Zen Kaku Gothic New', sans-serif;
}

p.business{
  display: block;  
  margin: 0;
  font-size: 1.4em;
  line-height: 140%;  
}

.eachPhilosophy{
  margin: 80px 0;
}

article.philosophy{
  margin-bottom: 60px;
  display: flex;
}

article.philosophy:last-child{
  margin-bottom: 0;
}

.icons{
  flex: 1;
}

img.philosophy{
  padding-top: 3px;
  width: 100%;
}

.texts{
  flex: 4;
  padding-left: 5%; 
}

h3.philosophy{
  display: block;
  font-weight: 700; 
  font-size: 1.8vw;
  margin-bottom: 20px;
  font-family: 'Zen Kaku Gothic New', sans-serif;  
}

p.philosophy{
  display: block;
  font-size: 1.4em;
  line-height: 140%;
}


img.back_1{
  position: absolute;
  right: 0;
  z-index: 9;
  width: 80%;
}


/*COMPANY*/

#companyTop{
    padding-top: 40px;
    margin-top: -40px;
}

section.outerLineCompany{
  display: block;
  padding: 60px 0 0 0;
  margin: 0;
  width: 100%;
  display: block; 
  background-image: url(../img/grey_dot.jpg);
  background-position: bottom;  
  background-size: 100%;
  background-repeat: no-repeat; 
  background-color: white;
}

article.company{
  position: relative;
  z-index: 999;
  margin-bottom: 80px;
  display: flex;
}

.companyText{
  display: block;
  flex: 5; 
}

table{
    table-layout: fixed;
}


table.company{ 
  display: table !important;  
/*  display: block;*/
  width: 100%;
  margin-right: 4%; 
}

tbody.company{ 
  display: block;
  width: 100%;
  margin-right: 0; 
}

tr.company{
  display: block;
  width: 100%;  
/*  padding-bottom: 10px;*/
  display:flex;
}

th.company{
  line-height: 140%;  
  width: 100%;   
  font-weight: nomal!important;
  font-size: 1.4em;
  padding-bottom: 20px;  
  flex: 3;
}

td.company{
  width: 100%;  
  line-height: 140%;
  font-size: 1.4em;  
  padding-bottom: 20px;  
  flex: 5;
}


span.company{
  display: block;
/*  padding-bottom: 10px;*/
}

span.company_re{
  display: block;
}

.companyImg{
  flex: 4;
  width: 100%; 
  padding:0;
}

img.company{
  width: 100%;
  max-height: 300px;
  border: solid black;  
}


.CEO{
  display: flex;
  margin-right: 0px;
}

.CEO_text{
  flex: 4;
}

.CEO_img{
  flex: 1;
  margin-right: 50px;
}


img.CEO{
  width: 100%;
  border-radius: 50%;  
}


article.CEO_profile{
  position: relative;
  z-index: 999;
  margin-bottom: 120px;
  display: block;
}

img.CEO{
  width: 120%;
}

h3.message{     
  padding-left: 0;
  padding-bottom: 40px;  
}

span.CEO_bigTitle{
  font-family: 'Roboto', sans-serif;      
  display: inline;   
  font-size: 3vw;
  margin-right: 3%;
}

span.CEO_smallTitle{
  display: inline;  
  font-size: 1.5vw;
}

.CEO_message{
  flex: 5;
}

span.ls{
  padding-right: 1%;
}

p.CEO{ 
  font-size: 1.4vw;
  padding:20px 0 20px 0;
/*  border-top: solid thin;*/
}

p.career{
  padding-bottom: 20px;
  padding-left: 0;
  line-height: 22px;
  font-size: 1.4em;  
}

img.textile{
  top: -50;
  z-index: 9;  
}


/*NEWS*/

#newsTop{
    padding-top: 40px;
    margin-top: -40px;
}

section.outerLineNews{
  padding-top: 60px;
  display: block;
  background-color: white;
}

dt.news{
  margin-bottom: 5px;
  font-size: 1.4em;
  padding-left: 1%;  
}

dd.news{
  margin-bottom: 20px;  
  padding-left: 1%;
  padding-bottom: 3px;  
  font-size: 1.4em;
}

img.textile{
  width: 100%;
}

/*CONTACT*/

#contactTop{
    padding-top: 40px;
    margin-top: -40px;
}

section.outerLineGrey{
  display: block;
  padding-top: 10px;  
  background-color: grey;
}

h2.titleWhite{
  display: block;
  margin: 60px 20% 50px 0;
  padding: 0 15%;
  color: white;
}

h2.titleWhite2{
  display: block;
  margin: 80px 20% 40px 0;
  padding: 0 15%;
  color: white;
/*  border-bottom: solid thin;*/
}

p.toiawase{
  font-size: 1.4em;
  color: white;  
  text-align: center;
  margin: 0;
  padding: 10px;
}

p.inquery{
  margin: 0 auto 80px;  
  display: block;
  text-align: center; 
}


a.inquery{
  border-radius: 10px;
  font-size: 1.6em;
  display: inline;  
  color: white;
  background-color: #e87902;
  padding: 10px 20px;
  text-align: center;
}

/*スクロールトップ*/

/*  span.pagetop{
    display: block;
  }*/

  #goto_top {
    position: fixed;
    right: 2%;
    bottom: 2%;

  }

  #goto_top a {
    letter-spacing: 0.05em;  
    font-size: 120%;
    display: block; 
    color: #fff;
    text-align: center;
    line-height: 70px;
    text-decoration: none;
    opacity: 0.9;
    width: 70px;
    height: 70px;
    border-radius: 50px;
    background: #0e63a4;
    display: block;        
  }   

  #goto_top a:hover {
    opacity: 0.7;
  } 


/*footer*/

#footer{
  display: block;
  padding: 10px 0 30px;  
  background-color: grey;
}

ul.footerNav{
  margin:0 30%;
  display: flex;
}

li.footerNav{
  font-family: 'Roboto', sans-serif;      
  color: white;
  text-align: center;
  display: inline-block;
  margin:0 1%;
  padding:1%;
  flex: 1;
  font-size: 1.3em;  
}

li.footerNav_3{
  font-family: 'Roboto', sans-serif;      
  color: white;  
  text-align: center;
  display: inline-block;
  margin:0;
  padding:1%;
  flex: 1;
  font-size: 1.3em;  
}

.sns_icon{
  margin: 20px 0 30px;
  text-align: center;
}

a.sns_icon{
  color: white;
  font-size: 2.5em;
  padding: 0 0.5%;
  margin: 0 0.5%;
}

.copyRight{
  display: block;
}

small.copyRight{
  color: white;
  text-align: center;
  font-size: 1.3em;
}




/*contact*/

.contact{
  width: 100%;
  display: block;
  height: 100%;
  background-color: white;
  padding: 0 0 20px;
}


.contactForm{
  width: 100%;
  display: block;
  margin: 0 auto;
}

/*ContactForm7カスタマイズ*/

table.CF7_table{
  background-color:white;
  width:60%;
  margin: 100px auto 10px;
}

table.CF7_table tr{
  margin: 20px 0;
  display:flex;
}

table.CF7_table th{
  flex:1;
  background-color:white;
  padding: 0;
  font-weight: nomal!important;
  font-size: 1.2em;
  font-family: 'Roboto', sans-serif;  
}

table.CF7_table td{
  flex:2; 
  width:100%;
  padding: 0;
  font-size: 14px;  
  font-family: 'Roboto', sans-serif;    
}

.single .entry-content table.CF7_table,
.page .entry-content table.CF7_table{
  display:table;
}

/*入力欄*/
.CF7_table input, .CF7_table textarea {
  border: 1px solid #d8d8d8;
}

textarea{
  width: 100%;
}  

/*  input.wpcf7-form-control{
  width: 100%;
}    */

input.wpcf7-text{
  width: 100%;
}    

input.wpcf7-email{
  width: 100%;
}    

input.wpcf7-validates-as-required{
  width: 100%;
}    

input.wpcf7-validates-as-email{
  width: 100%;
}    


.CF7_table ::placeholder {
  color:#797979;
}

/*「必須」文字*/
.CF7_req{
  font-size:.9em;
  padding:5px;
  background-color: #e87902;
  color: #fff;
  border-radius: 3px;
  margin-right:1em;
}

/*「任意」文字*/
.CF7_unreq{
  font-size:.9em;
  padding: 5px;
  background: #bdbdbd;/*グレー*/
  color: #fff;
  border-radius: 3px;
  margin-right:1em;
}

 /* 「送信する」ボタン */
  .wpcf7 input.wpcf7-submit {
    background-color: #e87902;
    border:0;
    color:#fff;
    font-size:1.2em;
    font-weight:bold;
    margin:0 auto;
     padding:10px 30px;
    border-radius:10px;
  }

  .CF7_btn{
    text-align:center;
    margin:0 auto 50px;
  }

  span.wpcf7-spinner{
    display:none;
    width:0;
    margin:0;
  }

.outerLine{
    width:100%;
    display:block;
}

.response{
   width: fit-content;
  margin:0 auto 40px;  
}

/* 送信後のメッセージ */
.wpcf7-response-output{
  text-align:center;
  width:100%;
  display:block;
  margin:0 auto 30px;
  padding:20%;
}
