@charset "UTF-8";
/* CSS Document */

header{
background-image: url("/img/i-main.jpg");
background-position: center center;
}
.head_title{
background-color:rgba(255,255,255,0.8);
}
.head_img{
position: relative;
height: 700px;
}
.head_img img{
width: 100%;
}
.i-head01{
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
max-width: 500px;
}
.i-head02{
position: absolute;
top: 70%;
left: 50%;
transform: translateX(-50%);
max-width: 550px;
}
.i-head03{
position: absolute;
bottom: 15px;
left: 15px;
max-width: 250px;
}
@media (max-width: 992px) {
.head_img{height: 500px;}
.i-head01{
top: 35%;
transform: translateY(-35%) translateX(-50%);
width: 60%;
max-width: 500px;
}
.i-head02{
width: 70%;
max-width: 550px;
}
.i-head03{
left: auto;
right: 15px;
max-width: 150px;
}
}
@media (max-width: 768px) {
.i-head01{
top: 35%;
transform: translateY(-35%) translateX(-50%);
width:90%;
}
.i-head02{
top: 60%;
width: 90%;
}
.i-head03{
top:15px;
right: 0;
max-width: 100px;
}
}

/*--#i-rule--*/
#i-rule{
padding: 3rem 1.5rem;
text-align: center;
font-weight: 600;
}
#i-rule a{
display: inline-block;
margin: 0 1.5rem;
}
#i-rule a:hover{
color: #E48020;
}
#i-rule a::after {
color: #E48020;
}

/*--#i-news--*/
#i-news{
padding: 2rem 1.5rem 3rem;
background: #FFB580;
}
#i-news h3{
text-align: center;
font-size: 1.6rem;
}
#i-news .text-box{
background-color:rgba(255,255,255,0.8);
border-radius: 20px;
padding: 2rem 2rem 1rem;
margin-top: 1.5rem;
}
#i-news ul{
display: table;
max-width: 1000px;
width: 100%;
margin-left: auto;
margin-right: auto;
}
#i-news li{
display: table-cell;
border-bottom: 1px solid #C8C8C8;
padding: 1rem 0 1.5rem;
text-align: left;
}
#i-news li a:hover{
text-decoration: underline;
}
#i-news li span{
display: inline-block;
background:#FF8000;
border-radius: 20px;
padding: 0.2rem 2rem 0.4rem;
color: #fff;
text-align:center
}
#i-news li:first-of-type{
width: 130px;
}
#i-news ul:last-of-type li{
border: none;
}
#i-news p{
margin-top: 1rem;
text-align: right;
}
#i-news p a:hover{
text-decoration: underline;
}
@media (max-width: 992px) {
#i-news{padding: 2rem 0 3rem;}
#i-news .text-box{padding: 1rem 2rem 0.5rem;}
#i-news li{display: block;}
#i-news li:first-of-type{border: none;padding: 1rem 0 0;}
}

/*--#i-about--*/
#i-about{
position: relative;
}
#i-about .title{
width: 100%;
position: absolute;
top: 40px;
left: 0;
z-index: 1;
}
#i-about .title h2{
padding: 0 0 0 40px;
font-size: 2.5rem;
font-weight: 600;
letter-spacing: 0.2rem;
}
#i-about .title p{
width: 30%;
margin-top: 2rem;
text-align: right;
padding: 5px 20px 5px 40px;
color: #fff;
font-size: 1.4rem;  
font-weight: 600;
letter-spacing: 0.4rem;
background: #FF8000;
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
}
#i-about img{
width: 100%;
}
#i-about .img-box{
z-index: 0;
}
#i-about .img-box img{
padding-top: 5rem;
}
#i-about .text-box{
}
#i-about .text-box > img{
max-width: 160px;
display: block;
margin: 2rem auto;
}
#i-about .box1{
background: #fff;
padding: 2rem 3rem;
box-shadow: 8px 8px 10px 0px rgba(0,0,0,0.1);
}
#i-about .box1 h3{
font-size: 2rem;
line-height: 2em;
padding-bottom: 1.5rem;
border-bottom: 1px solid #C8C8C8;
}
#i-about .box1 p{
margin-top: 1.5rem;
line-height: 3rem;
}
#i-about .box2{
margin-top: 2rem;
background: #D7E2E5;
padding: 3rem 2rem 2rem;
box-shadow: 8px 8px 10px 0px rgba(0,0,0,0.1);
}
#i-about .box2 li{
vertical-align: top;
padding: 0 5px;
width: 20%;
}
#i-about .box2 li:nth-of-type(3){
width: 55%
}
#i-about .box2 h4{
font-size: 1.8rem;
padding-bottom: 1rem;
border-bottom: 1px solid #A9A9A9;
}
#i-about .box3{
margin-top: 2rem;
background: #FFCB9A;
padding: 2rem 3rem 3rem;
box-shadow: 8px 8px 10px 0px rgba(0,0,0,0.1);
}
#i-about .box3 p{
margin-bottom: 1.5rem;
}
#i-about .box3 p:nth-of-type(2){
margin-top: 1.5rem;
}
#i-about button{
margin: 2rem auto;
}
@media (max-width: 992px) {
#i-about .title p{width: 40%;}
#i-about .title{top: 25px;}
#i-about .title h2{font-size: 1.8rem;}
#i-about .text-box > img{max-width: 110px;margin: 1rem auto;}
#i-about .box1{padding: 2rem;}
#i-about .box1 h3{font-size: 1.8rem;line-height: 2.5rem}
#i-about .box2 ul{text-align: center;}
#i-about .box2 li{width: 25%;}
#i-about .box2 li:nth-of-type(3){margin-top: 1.5rem;width: 100%}
}

/*--#i-service--*/
#i-service{
background: url("/img/i-service-back.jpg");
background-size: cover;
padding-bottom: 5rem;
}
#i-service .title{
padding-top: 40px;
}
#i-service .title h2{
padding: 0 0 0 40px;
font-size: 2.5rem;
font-weight: 600;
letter-spacing: 0.2rem;
}
#i-service .title p{
width: 30%;
margin-top: 2rem;
text-align: right;
padding: 5px 20px 5px 40px;
color: #fff;
font-size: 1.4rem;  
font-weight: 600;
letter-spacing: 0.4rem;
background: #FF8000;
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
}
#i-service .contents-box{
margin-top: 3rem;
}
#i-service img{
width: 100%;
}
#i-service .img-box{
margin-bottom: 3rem;
}
#i-service .text-box{
position: relative;
margin-bottom: 3rem;
}
#i-service .text-box h3{
position: absolute;
top:30px;
left: -40px;
font-size: 2.5rem;
font-weight: 700;
letter-spacing: 0.5rem;
}
#i-service .text-box h3 span{
display: inline-block;
background: #fff;
padding: 1rem;
margin-top: 1.5rem;
}
#i-service .text-box h3 span:nth-of-type(1){
margin-left: -40px;
}
#i-service .text-box p{
margin-top: 200px;
line-height: 3rem;
}
#i-service button{
margin: 2rem auto 0;
}
#i-service .contents-box > h3{
background: #5D91B6;
margin: 0;
padding: 1.5rem;
font-size: 2rem;
color: #fff;
text-align: center;
}
#i-service ul{
display: table;
background: #fff;
width: 100%;
padding: 2rem;
margin-bottom: 3rem;
}
#i-service li{
display: table-cell;
padding: 0 1rem 1rem;
border-right: 1px dotted #000;
vertical-align: middle;
}
#i-service li a{
display: block;
padding: 1rem;
border-bottom: 1px dotted #000;
}
#i-service li:last-of-type{
border: none;
}
#i-service li a:last-of-type{
border: none;
}


@media (max-width: 992px) {
#i-service .title p{width: 40%;}
#i-service .title{top: 25px;}
#i-service .title h2{font-size: 1.8rem;}
#i-service .img-box{margin-bottom: 1.5rem;}
#i-service .text-box h3{position: relative;top:0;left: 0px;font-size: 1.8rem;letter-spacing: 0.2rem;
}
#i-service .text-box h3 span:nth-of-type(1){margin-left: 0px;}
#i-service .text-box p{margin-top: 20px;line-height: 3rem;}
#i-service ul{padding: 1rem;}
#i-service li{padding: 0 0 1rem;}
#i-service li a{padding: 1rem 0.5rem;}
}