/**********スクリーンサイズ PC **********/
body{
position:relative;
width:900px;
max-width: 90%;
margin: 0 auto;
overflow-x: hidden;
background: #ffffff;
color: #0e0e0e;
font-family: "Helvetica Neue", "Hiragino Kaku Gothic Pro", "Hiragino Sans", "Meiryo", sans-serif;
}

#eswsContainer{
margin-right: auto;
margin-left : auto;
}

.eswsInquiryWidget, #eswsHeaderParagraph1, #eswsHeaderParagraph2, #eswsMenu, #eswsFooterText{
display: none;
}

#eswsPaneAlpha{
background-color: #ffffff;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 50px;
z-index: 1000000;
}


h1{
font-size: 20px;
color: #2b50aa;
position: fixed;
top: 0;
z-index: 1100000;
margin-left: -5%;
}

h2{
font-size: 20px;
line-height: 50px;
color: #aba9c3;
font-weight: normal;
text-align: center;
padding-top: 80px;
margin-bottom: 60px;
}

h3{
font-size: 20px;
font-family: serif;
display: inline-block;
padding-left: 10px;
margin-top: 0;
border-left: 4px solid #f59aa2;
}

p{
margin: 0;
font-size: 16px;
line-height: 28px;
}

p.main-message{
font-size: 58px;
font-family: serif;
line-height: 120px;
margin: 180px 0 80px;
}

p.h2-message{
font-size: 28px;
line-height: 48px;
margin: 40px 0;
}

div.section{
padding-bottom: 120px;
}

div.aboutus-flex{
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}

div.aboutus-text{
width: 470px;
max-width: 100%;
}

div.aboutus-img{
width: 420px;
max-width: 100%;
}

div.aboutus-img img{
width: 100%;
height: auto;
}

div.full-w{
background: #2b50aa;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
width: 900px;
}

div.service{
color: #ced3dc;
}

div.service-flex{
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
margin-bottom: 100px;
}

div.service-flex-reverse{
display: flex;
justify-content: space-between;
flex-direction: row-reverse;
align-items: center;
flex-wrap: wrap;
margin-bottom: 100px;
}

div.service-flex:last-child{
margin-bottom: 0;
}

div.service-text{
width: 50%;
min-width: 300px;
}

div.service-img{
width: 48%;
min-width: 300px;
}

div.service-img img{
width: 100%;
height: auto;
border: 4px solid #ced3dc;
box-sizing: border-box;
}

div.accessmap{
max-width: 100%;
margin: 20px 0 100px;
}

iframe{
max-width: 100%;
}

div.company-flex{
display: flex;
justify-content: space-between;
align-items: start;
flex-wrap: wrap;
}

table.company{
border-collapse: collapse;
width: 400px;
max-width: 100%;
}

table.company th{
width: 25%;
padding: 8px 0;
text-align: left;
vertical-align: top;
color: #5f5f5f;
}

table.company td{
width: 75%;
padding: 8px 0;
text-align: left;
vertical-align: top;
}

div#eswsPageTop{
display: none;
}

div#eswsFooter{
height: 50px;
background: #2b50aa;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
width: 100vw;
box-sizing: border-box;
}

address#eswsCopyright{
font-style: normal;
font-size: 16px;
line-height: 50px;
color: #e0e0e0;
text-align: center;
}


/**********スクリーンサイズ ～1024px **********/
@media screen and (max-width: 1024px) {


body{
width:90%;
}

h2{
font-size: 20px;
line-height: 30px;
color: #aba9c3;
font-weight: normal;
text-align: center;
padding-top: 60px;
margin-bottom: 60px;
}

p.main-message{
font-size: 50px;
font-family: serif;
line-height: 100px;
margin: 180px 0 50px;
}

p.h2-message{
font-size: 20px;
line-height: 40px;
margin: 30px 0;
}

div.aboutus-text{
width: 48%;
}

div.aboutus-img{
width: 52%;
}

div.full-w{
background: #2b50aa;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
width: 100vw;
box-sizing: border-box;
}

div.service{
width: 100%;
max-width: 100%;
color: #ced3dc;
}

div.service-text{
width: 54%;
min-width: 54%;
}

div.service-img{
width: 42%;
min-width: 42%;
}

}


/**********スクリーンサイズ ～896px **********/
@media screen and (max-width: 896px) {

body{
width:90%;
}

h2{
font-size: 20px;
line-height: 30px;
color: #aba9c3;
font-weight: normal;
text-align: center;
padding-top: 60px;
margin-bottom: 60px;
}

p.main-message{
font-size: 40px;
font-family: serif;
line-height: 80px;
margin: 160px 0 50px;
}

p.h2-message{
font-size: 20px;
line-height: 40px;
margin: 30px 0;
}

div.aboutus-text{
width: 320px;
max-width: 100%;
}

div.full-w{
background: #2b50aa;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
width: 100vw;
box-sizing: border-box;
}

div.service{
width: 100%;
max-width: 100%;
color: #ced3dc;
}

div.service-text{
width: 60%;
min-width: 60%;
}

div.service-img{
width: 38%;
min-width: 38%;
}

table.company{
border-collapse: collapse;
width: 100%;
}

table.company th{
width: 30%;
}

table.company td{
width: 70%;
}

}


/**********スクリーンサイズ ～480px **********/
@media screen and (max-width:480px) {

body{
width:90%;
}

h2{
font-size: 20px;
line-height: 30px;
color: #aba9c3;
font-weight: normal;
text-align: center;
padding-top: 60px;
margin-bottom: 60px;
}

p{
font-size: 14px;
}

p.main-message{
font-size: 36px;
font-family: serif;
line-height: 80px;
margin: 160px 0 50px;
}

p.h2-message{
font-size: 18px;
line-height: 40px;
margin: 30px 0;
text-align: center;
}

div.aboutus-flex{
display: flex;
flex-direction: column;
}

div.aboutus-text{
width: 100%;
}

div.aboutus-img{
width: 100%;
}

div.full-w{
background: #2b50aa;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
width: 100vw;
box-sizing: border-box;
}

div.service{
width: 100%;
max-width: 100%;
color: #ced3dc;
}

div.service-flex{
display: flex;
flex-direction: column;
}

div.service-flex-reverse{
display: flex;
flex-direction: column;
}

div.service-text{
width: 100%;
margin-bottom: 20px;
}

div.service-img{
width: 100%;
}

div.service-img img{
width: 100%;
height: auto;
border: 4px solid #ced3dc;
box-sizing: border-box;
}

div.accessmap{
width: 100%;
margin: 20px 0 100px;
}

iframe{
max-width: 100%;
}

div.company-flex{
display: flex;
flex-direction: column;
}

table.company{
border-collapse: collapse;
width: 100%;
font-size: 14px;
}

}