@charset "utf-8";
  
/*----------Reset-------*/

*{ margin: 0;padding: 0}
a { text-decoration : none}
a:hover, a:focus { text-decoration: underline;}
ul, ol { list-style : none;}
img { vertical-align : middle;}

.clearfix:after {clear: both;}
.clearfix:before, .clearfix:after {content: " ";display: table;}

button, input, select, textarea {
font-family: inherit;
font-size: 100%;
margin: 0;}
button, input { line-height: normal;}

* {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

select {
padding: 3px;}

textarea, input[type="text"], input[type="email"], input[type="password"] {
display: block;
width: 100%;
border-radius: 5px;
border: 2px solid #ccc;
padding: 5px 10px;
outline: none;}


/*----------Fluid-img-------*/
img { width : 100%; height: auto;}

/*----------Body-------*/
body {
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, 'ＭＳ Ｐゴシック', 'ＭＳ ゴシック', sans-serif !important;
font-size: 14px;
font-style: normal;
line-height:1.2em;
color: #000;
background-color: #fff;
}

header h1 a.logo { 
float : left; width: 30%;}
header h1 a.tel { 
float : right; width: 70%;}


/*----------Contents-------*/

#contents { 
margin : 0 auto;}

#set1 { position:relative;}
#set1 h2 { }

#set1 .box { 
background-image: url(../images/contents-1-2.png);
background-size: 100% auto;
background-repeat: no-repeat;
padding-bottom: 10px;}

#set1 .box-in { 
line-height:1.5em;
background-color: rgba(256,256,256,0.6);
border: solid 2px #fff;
border-radius: 5px;
margin:0 10px;
padding: 10px;}

#set2 { margin-bottom: 20px;
background-color: #feec85;}
#set2 h3 { margin-top: 10px;}

#set2 .row {}
#set2 .twentytwenty-wrapper {
background-color: #fff;
padding: 10px;
margin-bottom: 10px;}
#set2 .twentytwenty-container {
border: solid 1px #b78d15;}

#set3 { margin-bottom: 20px;}
#set3 .mb { margin-bottom: 10px;}

#set4 { margin-bottom: 20px;}
#set4 h3 { margin-bottom: 10px;}
#set4 h3 img { vertical-align: top;}
#set4 .box { line-height:1.5em;}
#set4 .box p { margin-bottom: 10px;
padding: 0 10px;}
#set4 .left { float: left; width: 30%;}
#set4 .right { float: right; width: 30%;}

#set4 span.notes { 
font-size: 80%;
color: #ff6600;
margin-right: 0.3em;}
#set4 .box p.notes { 
margin-bottom: 5px;
font-weight: bold;
background-color: #ff6600;
color: #fff;
font-size: 100%;
text-align: left; }

#set4 h4 { color: #630;
margin: 10px 0;}
#set4 h4 span.maru { 
font-weight: bold;
background-color: #630;
color: #fff;
border-radius: 15px;
margin: 0 5px 0 10px;
padding: 5px;}

#set4 span.orange { 
color: #ff6600;}

#set5 .box { 
position: relative;
background-image: url(../images/contents-5-bg.jpg);
background-size: 100% auto;
background-repeat: no-repeat;
background-color: #feec85;
margin: 30px 0;}
#set5 h2 { 
position: relative;
top: -20px;
left: 20px;
width: 90%;}
#set5 h3 { 
position: relative;
top: -20px;
left: 30px;
width: 75%;}

#set5 .box-in { 
margin: 0 10px;}
#set5 .box-img { 
display: inline-block;
width: 45%;
margin-left: 10px;
vertical-align:middle;}
#set5 .center { 
text-align: center;}
#set5 p.box-in { 
margin-top: 20px;}

#set6 .step {
width: 55%;
padding-left: 10px;}
#set6 .step-txt { 
border-top: solid 1px #ccc;
margin-top: 10px;
padding: 10px 10px 20px 10px;
line-height:1.5em;}

#set6 .box-right { 
float: right;
width: 40%;
vertical-align:middle;
padding: 0 0 10px 10px;}
#set6 .box-txt { 
margin-bottom: 50px;}

p.notes { 
font-size: 80%;
color: #666;
text-align: center;}


  
/*----------Footer-------*/

footer {
background-image: url(../images/footer-bg.jpg);
background-size: 100% auto;
background-repeat: no-repeat;
padding: 20px;
text-align: center;
}

footer div { 
margin-bottom: 10px;}
footer p { 
padding-top: 20px;
color: #fff;}