/**************
mail用スタイルシート
**************/
@charset "UTF-8";
@import url(style.css);

.wrapper{
  background-image:url('../image/back_2leaf.png');
  background-repeat:no-repeat;
  background-size:cover;
}


body{
 background-color: #f9fff2;
 background-image:none;
 }

h2 {
 border:1px solid #9ec34b;
 background-color:#EEE8AA;
 border-radius:5px;
 display:inline-block;
 padding:5px;
}

h2:before{
 content: "★";
 color : white;
 
}

h2:after{
 content: "★";
 color : white;
 
}

h3 {
 margin:20px 0px 0px 0px;;
 font-size:1rem;
}


.button {
 display:inline-block;
 width:100px;
 text-decoration:none;
 border: 2px solid #9ec34b;
 color: #9ec34b;
 font-weight:bold;
 padding: 8px 16px;
 border-radius: 4px;
 box-sizing:border-box;
 transition: 0.4s;
}

.button:hover{
 background-color: #9ec34b;
 border-color:#cbe585;
 color:#ffffff;
}

.gotop{
  display:block;
  text-align:center;
  font-size:3rem;

}
/*****************
ヘッダー
******************/

#header{
    background-image:none;
    background-color:rgb(152,251,152,0.5);
}




/****************
confirm.php
*****************/

#confirm{
  margin:0 auto;
  text-align:center;
}

table{
 border-collapse: collapse;
 width:90%;
 background-color:#fff5e5;
 opacity:50%;
 margin:1rem auto;
 
}

table th,table td{
 border:solid 1px green;
}

th {
 padding:10px;
 color:#FF6600;

}

td{
 padding:10px;
 font-weight:bold;
}

td.contents {
 padding-top:0px;
 vertical-align:top;

}




/**************
レスポンシブル
**************/

  @media(max-width:820px){

    #header .flex2{
        display:flex;
        flex-direction:row;
        justify-content:space-between;
       }

    #header .flex2 .tel{
        display:block;
        margin-left:1rem;
       }

    main{
      padding:8rem 1rem 1rem 1rem;
    }
  }
  
  @media(max-width:450px){
      
    .gotop{
        display:block;
        text-align:center;
        font-size:3rem;
      
      }
  }