*{
    font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
}

body{
    margin:0;
    padding:0;
}

h1{
    padding:2em 0;
    font-size:2rem;
    font-weight:400;
}
h2{
    font-size:1.5rem;
    font-weight:700;
}

.h2title {
	padding: 0em 0.5em;
	border-left: 10px solid #000;
}

.h2title_w {
	padding: 0em 0.5em;
	border-left: 10px solid #FFF;
}

.txt-center{
    text-align:center;
}



.wrapper{
    max-width:1300px;
    margin:0 auto;
}

section#header{
    margin:0;
    padding:2em;
    background-image:url(../images/computer.jpg);
    background-size:cover;
}

section#header h1{
    color:#FFF;
}


#us{
    padding:2rem 0;
}

/*Service Section*/

#service{
    padding:2rem 0;
    background-color:#0B4068;
    color:#FFF;
}

.rightcontents{
    padding:4.5rem 20px 2rem 20px;
}

.rightcontents-last{
    padding:2rem 20px 2rem 20px;
}

.rightcontents h3{
    line-height:1rem;
}

.rightcontents p{
    line-height:1.5rem;
}

.box{
    background-color:rgba(255, 255, 255, 0.8);
    width:100%;
    color:#333;
    margin:10px;
    text-align:center;
}

.box>.bar100{
    border-bottom:2px solid #0B4068;
}

.price_area{
    padding-bottom:2em;
}

.price_title{
    font-size:1rem;
    line-height:0;
    margin-top:4em;
}
.price{
    font-size:2rem;
    line-height:0;
}
.ex{
    font-size:0.8em;
    line-height:0;
}

/*dx section*/

#dx{
    padding:2rem 0;
}

/*footer Section*/
#footer{
    text-align:center;
    margin:0 auto;
    padding:2em 0;
    background-color:#000;
    color:#FFF;
}

/*SP*/
@media screen and (min-width:769px){
    .smt{
        display:none;
    }
}
@media screen and (max-width:768px){
    h1{
        padding:2em 0;
        font-size:2rem;
        font-weight:400;
    }
    #header img{
        width:50%;
        display:block;
        margin:0 auto;
    }
    .f-container{
        flex-direction: column;
        align-items: center;
    }
    .f-item20p{
        padding:0 20px;
    }
}

/*FlexBox Option*/

.f-container{
    display:flex;
}

.f-item1{
    flex-grow:1;
}

.f-item2{
    flex-grow:2;
}

.f-item3{
    flex-grow:3;
}

.f-item4{
    flex-grow:4;
}

.f-item5{
    flex-grow:5;
}

.f-item6{
    flex-grow:6;
}

.f-item7{
    flex-grow:7;
}

.f-item8{
    flex-grow:8;
}

.f-item9{
    flex-grow:9;
}


.f-item10p{
    flex-basis:10%;
}

.f-item20p{
    flex-basis:20%;
}

.f-item30p{
    flex-basis:30%;
}

.f-item40p{
    flex-basis:40%;
}

.f-item50p{
    flex-basis:50%;
}

.f-item60p{
    flex-basis:60%;
}

.f-item70p{
    flex-basis:70%;
}

.f-item80p{
    flex-basis:80%;
}

.f-item90p{
    flex-basis:90%;
}

.f-item100p{
    flex-basis:100%;
}

.bar-100{
    border-bottom:1px solid #DDD;
}

.el_imgbox{
    border-top: 1px solid black;
}
.el_imgbox .f-container{
    justify-content: center;
}