@charset "utf-8";
@charset "UTF-8";
@charset "utf-8";


html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin: 0;padding: 0;border: 0;font-size: 100%;vertical-align: baseline;}main{display: block;}ol,ul {list-style: none;}blockquote,q {quotes: none;}blockquote:before,blockquote:after,q:before,q:after {content: '';content: none;}table {border-collapse: collapse;border-spacing: 0;vertical-align: top;}address {font-style: normal;}caption,th,td {font-weight: normal;text-align: left;}a:focus {outline: thin dotted;}article,aside,details,figcaption,figure,footer,header,hgroup,nav,section {display: block;}audio,canvas,video {display: inline-block;}audio:not([controls]) {display: none;}del {color: #333;}ins {background: #fff9c0;text-decoration: none;}hr {border: 0;height: 1px;border-bottom: 1px solid #ccc;}sub,sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}button{border: none;background: none;display: block;cursor:pointer;}textarea,input {-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}sup {top: -0.5em;}sub {bottom: -0.25em;}small {font-size: smaller;}button,a {text-decoration:none;opacity: 1.0;transition: all 300ms ease;-webkit-transition: all 300ms ease;-moz-transition: all 300ms ease;}button:hover,a:hover{}.bold , .strong {font-weight: bold;} html {font-size: 100%;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;} img{border:0px none;margin:0;padding:0;border: 0;vertical-align: middle;-ms-interpolation-mode: bicubic;max-width: 100%;height: auto;} body {font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;word-break: break-all;} .fwn{font-weight:normal;} .strong{font-weight:bold;} .red{color:#CC0000;} .green{color:#006600;} .brown{color:#993300;}
.min{font-family: 'Times New Roman', '游明朝体', 'Yu Mincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'Hiragino Mincho ProN', 'ＭＳ Ｐ明朝', 'MS PMincho', serif;} .goshick{font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;} .marugo{font-family: "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro","メイリオ";}.clr:after {content: " ";display: block;height: 0;line-height: 0;clear: both;visibility: hidden;}.clr {display: inline-block;min-height: 1%;}* html .clr {height: 1%;}.clr {display: block;}form{display: inline;}a:focus, *:focus {outline:none;}
 * {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
body,
html {
min-width: 1000px;
} body {
font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック",
YuGothic, "メイリオ", Meiryo, sans-serif;
color: #000;
line-height: 1.6;
letter-spacing: 0px; font-size: 14px;
letter-spacing: 1px;
opacity: 0;
}
textarea,
button,
input {
font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック",
YuGothic, "メイリオ", Meiryo, sans-serif; }
.body_on {
transition: opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
opacity: 1;
}
button,
a {
color: #3d3938;
}
.mincho {
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",
"Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.fontEn {
font-family: "Lato", sans-serif;
font-weight: 600;
}
.fontEn2 {
font-family: "Poppins", sans-serif;
}
.wrapper {
}
.inview_box {
opacity: 0;
transition: all 1300ms cubic-bezier(0.86, 0, 0.07, 1);
-webkit-transition: all 1300ms cubic-bezier(0.86, 0, 0.07, 1);
-moz-transition: all 1300ms cubic-bezier(0.86, 0, 0.07, 1);
position: relative;
z-index: 1;
top: 50px;
}
.inview_box_on {
opacity: 1;
top: 0px;
}
.mainWidth {
padding: 0 3%;
}
.mainInner2 {
max-width: 1200px;
margin: 0 auto;
}
.mainInner {
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
margin: 0 auto;
max-width: 1200px;
padding: 0 3%;
}
.mainLine {
border-left: 1px solid #e9e9e9;
} #pageHeader {
height: 100px;
}
.hed_fix {
background: #fff;
position: fixed;
z-index: 10;
left: 0;
right: 0;
top: 0;
height: 100px;
min-width: 1000px;
}
.head_logo {
float: left;
margin: 33px 0 0 35px;
}
.head_nav {
float: right;
margin: 0 225px 0 0;
}
.sp_nav {
display: none;
}
.pc_nav .head_nav_list {
}
.pc_nav .head_nav_list li {
float: left;
margin: 0 0 0 22px;
}
.pc_nav .head_nav_list li:first-child {
margin-left: 0;
}
.pc_nav .head_nav_list a {
display: block;
font-size: 15px;
font-weight: bold;
text-align: center;
padding: 26px 15px 22px;
position: relative;
z-index: 1;
}
.pc_nav .head_nav_list a:before {
content: "";
z-index: 1;
position: absolute;
border-bottom: 3px solid #388ac4;
bottom: 12px;
right: 50%;
left: 50%;
transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.pc_nav .head_nav_list span {
display: block;
font-size: 12px;
margin: 7px 0 0;
color: #388ac4;
}
.pc_nav .head_contact {
position: absolute;
z-index: 1;
top: 0;
right: 0;
font-size: 16px;
background: #101c29;
color: #fff;
font-weight: bold;
letter-spacing: 1px;
line-height: 60px;
top: 20px;
right: 32px;
text-align: center;
width: 155px;
}
.pc_nav .head_contact span {
position: relative;
z-index: 1;
padding: 0 0 0 28px;
}
.pc_nav .head_contact span:before {
content: "";
z-index: 1;
position: absolute;
background: url(/common/img/icon01.svg) 0 0 no-repeat;
background-size: 100% auto;
width: 18px;
height: 16px;
top: 4px;
left: 3px;
}
@media screen and (max-width: 1100px) {
.pc_nav .head_nav_list li {
margin: 0 0 0 5px;
}
} #main {
} .ttl01 {
} .btn01 {
background: #388ac4;
border: 1px solid #388ac4;
color: #fff;
padding: 3px 0;
line-height: 42px;
text-align: center;
border-radius: 5px;
display: block;
position: relative;
z-index: 1;
}
.btn01:before {
content: "";
z-index: 1;
position: absolute;
border-bottom: 1px solid #fff;
width: 25px;
height: 0;
top: 0;
bottom: 0;
right: 0;
margin: auto;
transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
} .arw01 {
}
.flex01 {
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: stretch;
align-items: stretch;
-webkit-align-content: flex-start;
align-content: flex-start;
}
.flex01 > * {
display: inline-block;
-webkit-order: 0;
order: 0;
-webkit-flex-grow: 0;
flex-grow: 0;
-webkit-flex-shrink: 1;
flex-shrink: 1;
-webkit-flex-basis: auto;
flex-basis: auto;
-webkit-align-self: auto;
align-self: auto;
}
.flex02 {
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: center;
align-items: center;
-webkit-align-content: stretch;
align-content: stretch;
}
.flex02 > * {
display: inline-block;
-webkit-order: 0;
order: 0;
-webkit-flex-grow: 0;
flex-grow: 0;
-webkit-flex-shrink: 1;
flex-shrink: 1;
-webkit-flex-basis: auto;
flex-basis: auto;
-webkit-align-self: auto;
align-self: auto;
} .pageMainv {
}
.pageMainv_inner {
max-width: 1535px;
margin: 0 auto;
padding: 70px 0 106px;
position: relative;
}
.pageMainv_ttl {
position: relative;
z-index: 10;
}
.pageMainv_ttl_en {
font-size: 60px;
letter-spacing: 3px;
color: #fff;
}
.pageMainv_ttl_jp {
font-size: 16px;
position: relative;
z-index: 1;
top: -14px;
margin: 0 0 0 42px;
color: #fff;
}
.pageMainv_ttl_jp:before {
content: "";
z-index: 1;
position: absolute;
border-left: 1px solid #fff;
height: 20px;
top: 1px;
left: -24px;
}
.pageMainv_mes {
font-size: 16px;
background: #101c29;
color: #fff;
display: inline-block;
padding: 1px 6px;
position: relative;
z-index: 10;
}
.pageMainv_img {
position: absolute;
z-index: 1;
top: 0;
display: block;
left: 0; height: 100%;
margin: 0;
}
.pageMainv_img:before {
content: "";
z-index: 1;
position: absolute;
background: #1a63ac;
width: 2000px;
top: 0;
bottom: 38px;
right: 100%;
}
.pageMainv_img span {
background: 50% 50% no-repeat;
-moz-background-size: cover;
background-size: cover;
display: block;
position: absolute;
z-index: 5;
bottom: 0;
left: 0;
top: 0;
}
.pageMainv_works {
background: #1a63ac;
}
.pageMainv_works .pageMainv_inner {
padding: 48px 0;
}
.pageMainv_works .pageMainv_ttl_en {
font-size: 40px;
}
.pageMainv_works .pageMainv_ttl_jp {
top: -8px;
} .works_list {
position: relative;
z-index: 1; }
.works_list li {
width: 33.33%;
}
.works_list {
position: relative;
z-index: 1; }
.works_list li.fade {
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
opacity: 0;
}
.works_list li.fade_in {
opacity: 1;
}
.works_list a {
display: block;
}
.works_list_img {
position: relative;
z-index: 1;
overflow: hidden;
}
.works_list_img span {
display: block;
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(/common/img/noimage.png) 50% no-repeat;
-moz-background-size: cover;
background-size: cover;
transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.works_list_img img {
}
.works_list_txt {
padding: 45px 7% 40px;
}
.works_list_ttl {
font-size: 20px;
font-weight: bold;
line-height: 1.5;
margin: 0 0 22px;
}
.works_list_cat {
margin: 0 0 6px;
}
.works_list_cat span {
color: #388ac4;
margin: 0 28px 0 0;
letter-spacing: 2px;
position: relative;
z-index: 1;
}
.works_list_cat span:before {
content: "";
z-index: 1;
position: absolute;
border-right: 1px solid #388ac4;
height: 12px;
top: 3px;
right: -7px;
}
.works_list_tab {
background: #ecf2f7;
margin: 16px 0 0;
padding: 14px 18px;
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.works_list_tab span:before {
content: "／";
color: #388ac4;
}
.works_list_tab span:first-child:before {
display: none;
} .blog_list {
}
.blog_list_box {
width: 31.6%;
background: #fff;
box-shadow: 0px 7px 16px 0px rgba(0, 0, 0, 0.07);
margin: 0 0 82px 2.6%;
}
.blog_list_box.fade {
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
opacity: 0;
}
.blog_list_box.fade_in {
opacity: 1;
}
.blog_list_box:nth-child(3n + 1) {
margin-left: 0;
}
.blog_list_img {
position: relative;
z-index: 1;
overflow: hidden;
display: block;
}
.blog_list_img span {
-moz-background-size: cover;
background-size: cover;
background-position: 50%;
display: block;
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.blog_list_img img {
}
.blog_list_txt {
padding: 33px 6% 43px;
}
.blog_list_cat {
text-align: left;
margin: 0 0 16px;
}
.blog_list_cat span {
font-size: 13px;
color: #fff;
background: #388ac4;
display: inline-block;
padding: 3px 10px;
}
.blog_list_name {
font-size: 16px;
font-weight: bold;
margin: 0 0;
margin: 0 0 25px;
display: block;
}
.blog_list_tab {
}
.blog_list_tab a {
border: solid 1px #e9e9e9;
padding: 0px 10px;
margin: 0 10px 9px 0px;
display: inline-block;
} .pageSearch {
background: #1a63ac;
padding: 44px 5%;
}
.pageSearch_inner {
max-width: 500px;
margin: 0 auto;
padding: 0 35px 0 0;
position: relative;
z-index: 1;
}
.pageSearch_input {
background: none;
border: none;
border-bottom: 1px solid #fff;
width: 100%;
font-size: 16px;
padding: 11px 2px;
color: #fff;
border-radius: 0px;
}
.pageSearch_btn {
position: absolute;
z-index: 1;
top: 6px;
right: 0;
padding: 0;
}
.pageSearch_input:placeholder-shown {
color: #fff;
} .pageSearch_input::-webkit-input-placeholder {
color: #fff;
} .pageSearch_input:-moz-placeholder {
color: #fff;
opacity: 1;
} .pageSearch_input::-moz-placeholder {
color: #fff;
opacity: 1;
} .pageSearch_input:-ms-input-placeholder {
color: #fff;
} .categoryTag,
.pageTag {
padding: 41px 5% 90px;
}
.categoryTag_inner,
.pageTag_inner {
margin: 0 auto;
max-width: 769px;
letter-spacing: -0.4em;
text-align: center;
}
.categoryTag_inner a,
.pageTag_inner a {
display: inline-block;
border: solid 1px #c9c9c9;
letter-spacing: normal;
padding: 0px 13px;
margin: 0 5px 19px;
} .categoryMore,
.pageMore {
text-align: center;
}
.categoryMore_btn,
.pageMore_btn {
font-size: 22px;
display: inline-block;
line-height: 1.2;
position: relative;
z-index: 1;
}
.categoryMore_btn:before,
.pageMore_btn:before {
content: "";
z-index: 1;
position: absolute;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 10px solid #388ac4;
border-bottom: 0px solid transparent;
width: 0px;
height: 0px;
left: 0;
bottom: -20px;
right: 0;
margin: auto;
} .categoryMore_btn span,
.pageMore_btn span {
font-size: 50px;
display: block;
}
.spinner {
margin: 0; height: 40px;
text-align: center;
font-size: 10px;
position: absolute;
z-index: 1;
bottom: -37px;
right: 0;
left: 0; background: #fff;
display: none;
}
.pageMore_btn_on .spinner {
display: block;
}
.spinner > div {
background-color: #333;
height: 100%;
width: 6px;
display: inline-block;
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
animation: sk-stretchdelay 1.2s infinite ease-in-out;
}
.spinner .rect2 {
-webkit-animation-delay: -1.1s;
animation-delay: -1.1s;
}
.spinner .rect3 {
-webkit-animation-delay: -1s;
animation-delay: -1s;
}
.spinner .rect4 {
-webkit-animation-delay: -0.9s;
animation-delay: -0.9s;
}
.spinner .rect5 {
-webkit-animation-delay: -0.8s;
animation-delay: -0.8s;
}
@-webkit-keyframes sk-stretchdelay {
0%,
40%,
100% {
-webkit-transform: scaleY(0.4);
}
20% {
-webkit-transform: scaleY(1);
}
}
@keyframes sk-stretchdelay {
0%,
40%,
100% {
transform: scaleY(0.4);
-webkit-transform: scaleY(0.4);
}
20% {
transform: scaleY(1);
-webkit-transform: scaleY(1);
}
} .contact_form {
background: url(/img/works/form_bg.jpg) 50% 50% no-repeat;
-moz-background-size: cover;
background-size: cover;
}
.contact_form_inner {
max-width: 630px;
margin: 0 auto;
text-align: center;
padding: 92px 0 108px;
}
.contact_form_ttl {
font-size: 45px;
font-weight: bold;
color: #fff;
letter-spacing: 2px;
margin: 0 0 -14px;
}
.contact_form_img {
margin: 0 0 -58px;
}
.contact_form_mes {
color: #fff;
margin: 0 0 50px;
}
.contact_form_btn {
font-size: 16px;
padding: 14px 0;
background: #fff;
color: #388ac4;
}
.contact_form_btn:before {
border-color: #388ac4;
width: 40px;
} .pagePan {
}
.pagePan ol {
font-size: 12px;
padding: 25px 24px;
}
.pagePan li {
display: inline-block;
padding: 0 0 0 15px;
position: relative;
z-index: 1;
}
.pagePan li:before {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 1px;
width: 5px;
height: 5px;
margin: auto;
border-top: 1px solid rgb(137, 137, 137);
border-right: 1px solid rgb(137, 137, 137);
transform: rotate(45deg);
}
.pagePan li:first-child {
padding-left: 0;
}
.pagePan li:first-child:before {
display: none;
}
.pagePan a {
color: #1a63ac;
} .entory_body {
font-size: 16px;
margin: 0 0 69px;
}
.entory_body .aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.entory_body .alignleft {
float: left;
margin-right: 10px;
margin-bottom: 10px;
}
.entory_body .alignright {
float: right;
margin-left: 10px;
margin-bottom: 10px;
}
.entory_body h1 {
font-size: 28px;
margin: 20px 0;
}
.entory_body h2 {
font-size: 26px;
margin: 24px 0;
color: #388ac4;
position: relative;
z-index: 1;
padding: 0 0 16px;
}
.entory_body h2:before {
content: "";
z-index: 1;
position: absolute;
border-bottom: 4px solid #388ac4;
width: 49px;
bottom: 0;
left: 0;
}
.entory_body h2:after {
content: "";
z-index: 1;
position: absolute;
border-bottom: 4px solid #e2e2e2;
bottom: 0;
left: 54px;
right: 0;
}
.entory_body h3 {
font-size: 22px;
margin: 18px 0;
position: relative;
z-index: 1;
padding: 0 0 0 17px;
}
.entory_body h3:before {
content: "";
z-index: 1;
position: absolute;
border-left: 4px solid #388ac4;
height: 26px;
top: 4px;
left: 0;
}
.entory_body h4 {
font-size: 20px;
margin: 14px 0;
color: #388ac4;
}
.entory_body h5 {
font-size: 16px;
}
.entory_body h6 {
font-size: 16px;
}
.entory_body a {
color: #388ac4;
text-decoration: underline;
}
.entory_body a img {
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
}
.entory_body p {
margin: 14px 0;
}
.entory_body blockquote {
background: #ecf2f7;
padding: 20px 30px 20px 85px;
margin: 30px 0;
position: relative;
z-index: 1;
}
.entory_body blockquote:before {
content: "";
z-index: 1;
position: absolute;
background: url(/common/img/icon05.svg) 0 0 no-repeat;
width: 31px;
height: 22px;
top: 33px;
left: 39px;
}
.entory_body ul {
padding: 0 0 0 17px;
margin: 30px 0;
}
.entory_body ul > li {
position: relative;
z-index: 1;
margin: 7px 0;
}
.entory_body ul > li:after {
content: "";
position: absolute;
z-index: 1;
top: 8px;
left: -14px;
width: 5px;
height: 5px;
background: #388ac4;
transform: rotate(45deg);
}
.entory_body ol {
padding: 0 0 0 29px;
margin: 30px 0;
counter-reset: num;
}
.entory_body ol > li {
position: relative;
z-index: 1;
margin: 7px 0;
}
.entory_body ol > li:after {
counter-increment: num;
content: counter(num) ".";
position: absolute;
z-index: 1;
top: 0;
left: -26px;
color: #388ac4;
font-weight: bold;
}
.entory_body blockquote,
.entory_body p:after {
display: block;
content: "";
clear: both;
}
.entory_body table {
width: 100%;
margin: 34px 0;
}
.entory_body table td {
background: #ecf2f7;
border-bottom: 1px solid #388ac4;
border-right: 1px solid #388ac4;
padding: 17px 27px;
}
.entory_body table .td_color1 {
background: #1a63ac;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
color: #fff;
}
.entory_body table .td_color2 {
background: #388ac4;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
color: #fff;
}
.entory_body table tr:last-child td {
border-bottom: none;
}
.entory_body table td:last-child {
border-right: none;
}
.entory_body .note {
border: solid 1px #a0a0a0;
border-radius: 5px;
padding: 7px 20px;
}
.entory_body .linkbtn1 {
background: #101c29;
text-align: center;
display: inline-block;
color: #fff;
text-decoration: none;
padding: 23px 80px;
position: relative;
z-index: 1;
margin: 30px 0;
}
.entory_body .linkbtn1:before {
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 20px;
width: 10px;
height: 10px;
margin: auto;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
transform: rotate(45deg);
} .entory_body .counter-hierarchy {
position: relative;
z-index: 1;
background: #ecf2f7;
padding: 74px 4.6% 40px;
margin: 100px 0 70px;
}
.entory_body .toc-area_inner {
}
.entory_body .ez-toc-title-container {
}
.entory_body .ez-toc-title {
font-size: 18px;
color: #fff;
position: absolute;
z-index: 6;
top: -35px;
right: 0;
left: 0;
width: 70px;
height: 70px;
margin: 0 auto 0 !important;
text-align: center;
padding: 21px 0 0;
}
.entory_body .ez-toc-title:before {
content: "";
z-index: -1;
position: absolute;
background: #1a62ab;
font-size: 18px;  top: 0;
bottom: 0;
right: 0;
left: 0;
transform: rotate(45deg);
}
.entory_body .toc-area_btn {
display: none;
}
.entory_body .ez-toc-list {
padding: 0 !important;
margin: 0 !important;
}
.entory_body .ez-toc-list ul {
padding: 0;
margin: 0;
}
.entory_body .ez-toc-list a {
font-size: 15px;
color: #388ac4;
font-weight: bold;
}
.entory_body .ez-toc-list li {
padding: 0 0 0 20px;
margin: 0 0 7px;
position: relative;
z-index: 1;
}
.entory_body .ez-toc-list li:after {
display: none;
}
.entory_body .ez-toc-list > li:before {
content: "";
position: absolute;
z-index: 1;
top: 10px;
left: 3px;
width: 5px;
height: 5px;
background: #333333;
transform: rotate(45deg);
}
.entory_body .ez-toc-list > li > ul li:before {
content: "";
position: absolute;
z-index: 1;
top: 11px;
left: 5px;
width: 8px;
border-bottom: 2px solid #a1a4a8;
}  .pagetop_box {
position: relative;
z-index: 1;
}
.pagetop {
position: absolute;
z-index: 1;
right: 0;
top: -60px;
background: #388ac4;
overflow: hidden;
height: 60px;
width: 95px;
display: block;
text-indent: -96px;
}
.pagetop:before {
content: "";
position: absolute;
top: 16px;
bottom: 0;
right: 0;
left: 0;
width: 28px;
height: 28px;
margin: auto;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
transform: rotate(-45deg);
}
#pageFooter {
background: #000;
clear:both;
}
.foot_inner {
}
.foot_nav {
padding: 44px 0 17px;
border-bottom: 1px solid #fff;
margin: 0 0 22px;
}
.foot_nav li {
float: left;
margin: 0 0 0 29px;
}
.foot_nav li:first-child {
margin-left: 0;
}
.foot_nav a {
color: #fff;
}
.foot_nav .foot_nav_sns {
float: right;
}
.foot_nav .foot_nav_sns a {
display: block;
transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.foot_addr {
padding: 0 0 43px;
}
.foot_logo {
display: block;
width: 160px;
float: left;
}
.foot_copy {
color: #fff;
font-size: 10px;
float: right;
position: relative;
z-index: 1;
top: 6px;
} @media screen and (min-width: 681px) and (orientation: portrait),
screen and (min-width: 738px) and (orientation: landscape) {
.btn01:hover {
background: #fff;
color: #388ac4;
}
.btn01:hover:before {
border-color: #388ac4;
} a:hover .works_list_img span {
-webkit-transform: scale(1.1);
transform: scale(1.1);
} .pc_nav .head_contact:hover {
background: #879bb1;
}
.pc_nav .head_nav_list a:hover:before {
right: 3px;
left: 3px;
} .pagePan a:hover {
text-decoration: underline;
}
.pageTag_inner a:hover {
background: #efefef;
} .blog_list_img:hover span {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.blog_list_tab a:hover {
background: #efefef;
}
.entory_body a:hover {
text-decoration: none;
}
.entory_body a:hover img {
opacity: 0.7;
}
.entory_body .linkbtn1:hover {
background: #879bb1;
} .foot_nav a:hover {
text-decoration: underline;
}
.foot_nav_sns a:hover {
text-decoration: none;
display: block; }
.pagetop:hover {
background: #90c1ea;
} .contact_form_btn:hover {
background: #388ac4;
color: #fff;
}
.contact_form_btn:hover:before {
border-color: #fff;
}
} .sp-block,
.sp-inline {
display: none;
}
@media screen and (max-width: 680px) and (orientation: portrait),
screen and (max-width: 737px) and (orientation: landscape) {
body,
html {
min-width: 0px;
} body {
}
button,
a {
}
.wrapper {
}
.inview_box {
}
.inview_box_on {
}
.mainWidth {
padding: 0 5%;
}
.mainInner {
padding: 0 5%;
}
.mainInner2 {
}
.mainLine {
border-left: none;
} #pageHeader {
height: 60px;
}
.hed_fix {
min-width: 0;
height: 60px;
}
.hed_fix:before {
content: "";
z-index: 1;
position: fixed;
background: rgb(21, 60, 100, 0.85);
top: 60px;
bottom: 0;
right: 0;
left: 0;
visibility: hidden;
opacity: 0;
transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.sp_nav_on .hed_fix:before {
visibility: visible;
opacity: 1;
}
.head_logo {
float: none;
width: 149px;
margin: 18px auto 0;
position: relative;
z-index: 1;
}
.head_nav {
}
.pc_nav {
display: none;
}
.sp_nav {
display: block;
position: fixed;
z-index: 5;
top: 0;
width: 100%;
right: 100%;
bottom: 0;
transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.sp_nav_on .sp_nav {
right: 0%;
}
.sp_nav_inner {
overflow: scroll;
background: #fff;
height: 100%;
margin: 0 55px 0 0; }
.sp_nav_logo {
width: 145px;
display: block;
margin: 0 0 0 43px;
height: 60px;
padding: 19px 0;
}
.sp_nav_btn {
position: absolute;
z-index: 5;
display: block;
width: 60px;
height: 60px; top: 0;
right: -60px;
transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
-webkit-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
-moz-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.sp_nav_on .sp_nav_btn {
right: 0px;
}
.sp_nav_btn2 {
display: none;
}
.sp_nav_on .sp_nav_btn2 {
display: block;
position: absolute;
z-index: 5;
width: 60px;
top: 60px;
right: 0;
bottom: 0;
}
.sp_nav_btn span,
.sp_nav_btn:after,
.sp_nav_btn:before {
content: "";
z-index: 1;
position: absolute;
border-top: solid 1px #000;
left: 18px;
right: 18px;
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
overflow: hidden;
height: 0;
text-indent: -999px;
}
.sp_nav_btn:before {
bottom: 38px;
}
.sp_nav_btn:after {
top: 39px;
}
.sp_nav_btn span {
top: 30px;
}
.sp_nav_on .sp_nav_btn:before {
bottom: 29px;
transform: rotate(-45deg);
}
.sp_nav_on .sp_nav_btn:after {
top: 30px;
transform: rotate(45deg);
}
.sp_nav_on .sp_nav_btn span {
top: 30px;
opacity: 0;
}
.sp_nav_load {
padding: 11px 14% 30px;
}
.sp_nav .head_nav_list {
margin: 0 0 24px;
}
.sp_nav .head_nav_list li {
border-top: 1px solid #e5e5e5;
}
.sp_nav .head_nav_list li:first-child {
border-top: none;
}
.sp_nav .head_nav_list a {
display: block;
padding: 11px 19px;
font-size: 16px;
font-weight: bold;
}
.sp_nav .head_nav_list span {
display: none;
}
.sp_nav .head_contact {    font-size: 16px;
background: #101c29;
color: #fff;
font-weight: bold;
letter-spacing: 1px;
line-height: 55px;  text-align: center; display: block;
margin: 0 0 29px;
}
.sp_nav .head_contact span {
position: relative;
z-index: 1;
padding: 0 0 0 28px;
}
.sp_nav .head_contact span:before {
content: "";
z-index: 1;
position: absolute;
background: url(/common/img/icon01.svg) 0 0 no-repeat;
background-size: 100% auto;
width: 18px;
height: 16px;
top: 4px;
left: 3px;
} #main {
}
.mainv {
}
.mainv img {
} .ttl01 {
} .btn01 {
} .arw01 {
} .pageMainv {
}
.pageMainv_inner {
padding: 45px 0 43px;
}
.pageMainv_ttl {
margin: 0 0 10px;
}
.pageMainv_ttl_en {
font-size: 30px;
}
.pageMainv_ttl_jp {
font-size: 14px;
margin: 0 0 0 21px;
top: -5px;
}
.pageMainv_ttl_jp:before {
left: -13px;
top: 2px;
height: 16px;
}
.pageMainv_mes {
font-size: 13px;
background: none;
padding: 0;
}
.pageMainv_mes span {
background: #101c29;
display: inline-block;
padding: 0px 7px;
margin: 0 0 7px;
}
.pageMainv_img {
max-width: 278px;
}
.pageMainv_img:before {
bottom: 29px;
}
.pageMainv_img span {
}
.pageMainv_works {
}
.pageMainv_works .pageMainv_inner {
padding: 16px 0 7px;
}
.pageMainv_works .pageMainv_ttl_en {
font-size: 30px;
}
.pageMainv_works .pageMainv_ttl_jp {
top: -5px;
} .pageSearch {
padding: 12px 5% 18px;
}
.pageSearch_inner {
padding: 0;
}
.pageSearch_input {
position: relative;
z-index: 1;
border-radius: 0px;
}
.pageSearch_btn {
z-index: 5;
width: 20px;
top: 9px;
} .pageTag {
}
.pageTag_inner {
}
.pageTag_inner a {
} .pageMore {
}
.pageMore_btn {
font-size: 20px;
}
.pageMore_btn:before {
}
.pageMore_btn span {
font-size: 30px;
} .contact_form {
}
.contact_form_inner {
padding: 35px 0;
}
.contact_form_ttl {
font-size: 29px;
margin: 0 0 1px;
}
.contact_form_img {
margin: 0 0 -52px;
}
.contact_form_mes {
margin: 0 0 23px;
}
.contact_form_btn {
font-size: 13px;
padding: 5px 0;
}
.contact_form_btn:before {
width: 30px;
} .pagePan {
padding: 15px 5%;
overflow: scroll;
white-space: nowrap;
border-bottom: solid 1px #e9e9e9;
}
.pagePan ol {
padding: 0 20px 0 0;
display: inline;
}
.pagePan li {
display: inline;
}
.pagePan li:before {
}
.pagePan li:first-child {
}
.pagePan li:first-child:before {
}
.pagePan a {
} .entory_body {
font-size: 14px;
margin: 0 0 45px;
}
.entory_body .aligncenter {
}
.entory_body .alignleft {
}
.entory_body .alignright {
}
.entory_body h1 {
}
.entory_body h2 {
font-size: 19px;
padding: 0 0 10px;
margin: 15px 0;
}
.entory_body h2:before {
border-bottom: 3px solid #388ac4;
width: 37px;
}
.entory_body h2:after {
left: 44px;
}
.entory_body h3 {
font-size: 17px;
padding: 0 0 0 12px;
margin: 15px 0;
}
.entory_body h3:before {
border-left: 3px solid #388ac4;
height: 19px;
top: 5px;
}
.entory_body h4 {
font-size: 15px;
}
.entory_body h5 {
}
.entory_body h6 {
}
.entory_body a {
}
.entory_body p {
}
.entory_body blockquote {
padding: 3px 16px 5px 50px;
}
.entory_body blockquote:before {
top: 22px;
left: 15px;
background-size: 100% auto;
width: 26px;
}
.entory_body ul {
}
.entory_body ul > li {
}
.entory_body ul > li:after {
}
.entory_body ol {
}
.entory_body ol > li {
}
.entory_body ol > li:after {
}
.entory_body blockquote,
.entory_body p:after {
}
.entory_body table {
}
.entory_body table td {
padding: 8px 16px;
}
.entory_body table .td_color1 {
}
.entory_body table .td_color2 {
}
.entory_body table tr:last-child td {
}
.entory_body table td:last-child {
}
.entory_body .note {
}
.entory_body .linkbtn1 {
}
.entory_body .linkbtn1:before {
} .entory_body .counter-hierarchy {
}
.entory_body .toc-area_inner {
}
.entory_body .ez-toc-title-container {
}
.entory_body .ez-toc-title {
}
.entory_body .ez-toc-title:before {
}
.entory_body .toc-area_btn {
}
.entory_body .ez-toc-list {
}
.entory_body .ez-toc-list ul {
}
.entory_body .ez-toc-list a {
}
.entory_body .ez-toc-list li {
}
.entory_body .ez-toc-list li:after {
}
.entory_body .ez-toc-list > li:before {
}
.entory_body .ez-toc-list > li > ul li:before {
}
.entory_body .table_slid {
}
.entory_body .table_slid table {
width: 700px;
margin: 0;
}
.entory_body .table_slid {
overflow-x: scroll;
}
.entory_body .table_slid {
overflow-x: auto;
padding: 0 0 12px;
margin: 34px 0;
}
.entory_body .table_slid::-webkit-scrollbar {
width: 5px;
background: #f0f0f0;
}
.entory_body .table_slid::-webkit-scrollbar:horizontal {
height: 10px;
background: #f0f0f0;
}
.entory_body .table_slid::-webkit-scrollbar-thumb {
background: #388ac4;
}
.entory_body .table_slid::-webkit-scrollbar-thumb:horizontal {
background: #388ac4;
} .entory_body .counter-hierarchy {
padding: 40px 3.6% 10px;
margin: 54px 0 35px;
}
.entory_body .toc-area_inner {
}
.entory_body .ez-toc-title {
font-size: 14px;
width: 45px;
height: 45px;
padding: 12px 0 0;
margin: 0 auto 63px;
top: -21px;
}
.entory_body .ez-toc-title:before {
}
.entory_body .toc-area_btn {
}
.entory_body .ez-toc-list {
padding: 0 0 0 22px;
margin: 13px 0;
}
.entory_body .ez-toc-list ul {
}
.entory_body .ez-toc-list a {
}
.entory_body .ez-toc-list li {
}
.entory_body .ez-toc-list > li:before {
}
.entory_body .ez-toc-list > li > ul li:before {
} .pagetop_box {
}
.pagetop {
width: 64px;
height: 47px;
top: -47px;
}
.pagetop:before {
width: 12px;
height: 12px;
top: 5px;
}
#pageFooter {
}
.foot_inner {
}
.foot_nav {
}
.foot_nav li {
}
.foot_nav li:first-child {
}
.foot_nav a {
font-size: 12px;
}
.foot_nav .foot_nav_sns {
}
.foot_addr {
}
.foot_logo {
float: none;
margin: 0 auto 10px;
width: 166px;
}
.foot_copy {
text-align: center;
float: none;
}
.sp-none {
display: none;
}
.sp-block {
display: block;
}
.sp-inline {
display: inline;
}
.sp-brNone br {
display: none;
}
}
.sp_nav .sub-menu {
border-top: 1px solid #e5e5e5;
}
.pc_nav .sub-menu {
display: none;
}
.sp_nav .sub-menu a {
margin-left: 30px;
}
.pc_nav .has-submenu {
position: relative;
}
.pc_nav .sub-menu {
position: absolute;
background: rgba(255, 255, 255, 0.9);
padding: 10px 20px;
left: -50px;
}
.pc_nav .sub-menu li {
width: 100%;
white-space: nowrap;
}
.pc_nav .sub-menu li a {
text-align: left;
padding: 12px 20px 12px 20px;
display: inline-block;
}
.pc_nav .head_nav_list .sub-menu li {
margin-left: 15px;
}
.pc-none {
display: block;
}
@media screen and (min-width: 681px) { .pc-none {
display: none;
}
.pc_nav .has-submenu:hover .sub-menu {
display: block;
}
}
@media screen and (max-width: 1100px) {
.pc_nav .head_nav_list .sub-menu li {
margin-left: 15px;
}
}
.sp_nav_link a {
margin: auto 1px;
}
.recruit-bnr ul {
display: flex;
}
.recruit-bnr li {
height: 25vw;
flex: 1;
}
.recruit-bnr li a {
width: 100%;
padding: 6%;
height: 100%;
display: block;
}
.recruit-bnr .wantedly {
background: #388ac4;
color: #fff;
}
.recruit-bnr .infra {
background: #ffffff;
}
.recruit-bnr .infra p {
font-size: 44px;
font-weight: 600;
color: #333;
text-align: center;
margin: 16% auto 0;
}
.recruit-bnr .instagram {
background: #1b62ab;
color: #fff;
}
.recruit-bnr li a .bnr-txt {
display: block;
padding-top: 12%;
}
.recruit-bnr li a img {
margin: 18% auto auto;
display: block;
height: 56px;
width: auto;
}
.recruit-bnr.col3 li a img {
margin-top: 8%;
}
@media screen and (max-width: 1100px) {
.recruit-bnr li a {
padding: 6%;
}
.recruit-bnr li a .bnr-txt {
padding-top: 6%;
}
.recruit-bnr li a img {
margin-top: 5%;
max-height: 25%;
width: auto;
}
.recruit-bnr .infra p {
font-size: 34px;
margin-top: 6%;
}
}
@media screen and (max-width: 680px) and (orientation: portrait),
screen and (max-width: 737px) and (orientation: landscape) {
.recruit-bnr ul {
display: block;
}
.recruit-bnr li {
width: 50%;
height: 50vw;
float: left;
}
.recruit-bnr li a img {
margin-top: 4%;
max-height: 20%;
}
.recruit-bnr.col3 li a img {
margin-top: 8%;
max-height: 20%;
}
.recruit-bnr .infra p {
font-size: 22px;
margin-top: 22%;
}
.recruit-bnr li a .bnr-txt {
font-size: 90%;
}
}
.recruit_inner1 .recruit-bnr {
position: relative;
z-index: 1;
margin-top: 64px;
}
.recruit_inner1 .recruit-bnr li {
height: 33vw;
max-height: 240px;
}
.recruit_inner1 .recruit-bnr a {
background-color: #fff;
color: #3d3938;
padding: 6%;
box-shadow: rgba(30, 30, 30, 0.1) -2px 2px 10px 0px;
}
.recruit_inner1 .recruit-bnr li a .bnr-txt {
padding: 6%;
}
.recruit_inner1 .recruit-bnr li + li {
margin-left: 3%;
}
@media screen and (max-width: 680px) and (orientation: portrait),
screen and (max-width: 737px) and (orientation: landscape) {
.recruit_inner1 .recruit-bnr {
margin-top: 0px;
}
.recruit_inner1 .recruit-bnr li {
float: unset;
width: 100%;
margin-bottom: 20px;
height: auto;
}
.recruit_inner1 .recruit-bnr a {
padding: 1%;
}
.recruit_inner1 .recruit-bnr li + li {
margin-left: auto;
}
.recruit_inner1 .recruit-bnr li:last-child {
margin-bottom: 0;
}
.foot_nav {
clear: both;
}
}
@media screen and (max-width: 374px) {
.recruit-bnr li a .bnr-txt {
font-size: 70%;
}
}
@media screen and (min-width: 681px) {
.recruit-bnr  .blank-space{
display: none;
}
}
.recruit-bnr .blank-space {
background-color: #388ac4;
}[hidden] {
display: none !important;
}
.a2h-area {
box-sizing: border-box;
position: fixed;
z-index: 100;
}
.a2h-area.chrome-area {
background:#fff;
box-shadow:-2px 3px 5px rgba(50,50,93,.11), 3px -1px 5px rgba(0,0,0,.2);
width: 375px;
right: 20px;
bottom: 20px;
padding: 15px;
}
.a2h-area.ipad-area {
width: 246px;
right: 10px;
top: 0;
padding:10px;
background:transparent;
}
.a2h-area.iphone-area img,
.a2h-area.ipad-area img {
width: 100%;
}
.a2h-area.iphone-area {
background:transparent;
width: 90vw;
bottom:0;
padding:18px 15px 0px 15px;
left:5vw;
}
.a2h-area--a {
padding: 0;
background-color: transparent;
box-shadow: none
}
.a2h-close {
position: absolute;
top: 3px;
right: 1px;
width: 36px;
height: 36px;
background: url(//pantograph.co.jp/pwa/img/ios-close.svg) 0 0/contain no-repeat;
z-index: 10 
}
.a2h-area.chrome-area .a2h-close {
background: url(//pantograph.co.jp/pwa/img/a2h-close.svg) 0 0/contain no-repeat;
}
.a2h-area--a .a2h-close {
top: -14px;
right: -4px
}
.a2h-close:hover {
opacity: .8;
cursor: pointer
}
.a2h-area__box {
cursor: pointer;
}
.a2h-area__item {
text-align: center
}
.a2h-area__item+.a2h-area__item {
margin-left: 12px
}
.a2h-area.chrome-area .a2h-area__txt {
width: 167px;
margin: 0 auto 3px
}
.a2h-area__btn {
text-decoration: none!important;
display: inline-block;
width: 254px;
margin: 0 auto
}
.a2h-area--a .a2h-area__btn {
width: 285px
}
.a2h-area__item--heightFix .a2h-area__btn {
margin-top: 18px
}
.a2h-area__txtSub {
margin-top: -12px
}
.a2h-area__txtSub>a,.a2h-area__txtSub>a:visited {
color: #00d3e0!important
}
.a2h-area__txtSub>a:hover,.a2h-area__txtSub>a:visited:hover {
text-decoration: underline;
color: #00d3e0!important
}
.a2h-area__txtSub>a:visited>img,.a2h-area__txtSub>a>img {
vertical-align: middle;
}
.add-to-home-plus {
height: 65px;
width:65px;
margin-right:10px;
}
.add-to-home-plus img {
width:100%;
height:auto;
}
.menu-btn-wrap {
display:flex;
align-items: center;
}
.a2h-area.chrome-area .logo-area {
display:flex;
text-align:left;
}
.a2h-area.chrome-area .logo-area img {
margin-right: 20px;
}
.add-to-home-ttl{
font-size:18px;
margin-bottom: 5px;
font-weight: bold;
}
.add-to-home-url{
font-size: 12px;
}
.a2h-area.chrome-area .add-to-home-btn {
background: #5c81e6;
margin-top:10px;
padding: 5px 20px;
border-radius: 4px;
color: #fff;
font-size: 18px;
float:right;
}
@media screen and (max-width: 768px){
.add-to-home-plus {
height: 40px;
width:40px;
}
.a2h-area.chrome-area {
width: 100vw;
bottom:0;
left: 0;
right:10px;
}
} .add-to-home-plus {
position:absolute;
z-index: 11;
height: 60px;
width: 60px;
display: none;
}
@media screen and (max-width: 680px){ 
.add-to-home-plus {
right: 0;
top: 0;
display: block;
} 
}
.add-to-home-plus img {
width: 85%;
} .pushl-modal .subscription-dialog {
max-width: 340px !important;
font-size: 18px;
}

.pageMainv--contact{
position: relative;
height: 183px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.pageMainv--contact::before{
content: "";
position: absolute;
left: 0;
top: 0;
display: block;
background-color: #101c29;
height: 74.3%;
width: 16%;
z-index: -2;
}
.pageMainv--contact::after{
content: "";
position: absolute;
right: 0;
top: 0;
display: block;
background-color: #388ac4;
height: 100%;
width: 85.4%;
z-index: -1;
}
.contactMainTtl{
font-size: 45px;
color: #fff;
text-align: center;
}
.contactMainTtl .mini{
font-size: 16px;
display: block;
}
.bigTtitle{
text-align: center;
font-size: 30px;
}
.bigTtitle::after{
content: "";
display: block;
width: 22px;
height: 6px;
border-bottom: 2px solid #388ac4;
margin: 0 auto 55px;
}
#recEntry{
}
.form_inner--contact{
padding-bottom: 117px;
}
.formBox{
box-shadow: 0px 7px 7px #ccc;
box-shadow: 0px 7px 16px 0px rgba(0, 0, 0, 0.07);
padding-top: 80px;
}
.formPagecatch__txt{
text-align: center;
margin-bottom: 50px;
}
.status{
text-align:center;
width: 134px;
height: 134px;
position: relative;
font-size: 15px;
font-weight: bold;
color: #388ac4;
display: flex;
align-items: center;
justify-content: center;
}
.status::before{
content: "";
width: 94px;
height: 94px;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
background-color: #ecf2f7;
z-index: -1;
transform: rotate(45deg);
} .status.active{color: #fff;}
.status.active::before{background-color: #388ac4;}
.statusFlow{
display: flex;
justify-content: space-between;
position: relative;
max-width: 470px;
margin: 0 auto 60px;
}
.statusFlow::before{
content: "";
display: inline-block;
height: 1px;
width: 300px;
background-color: #d0dce5;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
z-index: -2;
} .formMainContents{
max-width: 800px;
margin: 0 auto;
}
.form__itemName{
font-weight: bold;
font-size: 16px;
padding-left: 13px;
position: relative;
z-index: 1;
vertical-align: middle;
margin: 0 0 20px 0;
}
.form__itemName::before{
content: "";
position: absolute;
border-left: 3px solid #388ac4;
height: 17px;
top: 0;
bottom: 0;
margin:auto 0;
left: 0;
z-index: 1;
}
.form__itemName .hissu{
font-size: 12px;
background-color: #f63a52;
color: #fff;
border-radius: 10px;
padding: 4px 9px;
margin-left: 10px;
position: relative;
top: -1px;
}
.form__itemName .nin_i{
font-size: 12px;
background-color: #388ac4;
color: #fff;
border-radius: 10px;
padding: 4px 9px;
margin-left: 10px;
position: relative;
top: -1px;
} input[type="text"]{
padding: 0;
border: none;
border-radius: 0;
outline: none;
background: none;
}
textarea{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
resize: none;
padding: 0;
border: 0;
outline: none;
background: transparent;
}
.formMainContents input[type="tel"],
.formMainContents input[type="email"],
.formMainContents input[type="url"],
.formMainContents input[type="text"]{
width: 100%;
height: 50px;
background-color: #ecf2f7;
font-size: 16px;
padding: 0 16px;
border: none;
-webkit-appearance: none;
}
.formMainContents textarea{
width: 100%;
height: 260px;
background-color: #ecf2f7;
font-size: 16px;
padding: 16px;
}
.formMainContents .inputTxt{
margin-bottom: 50px;
}
.formMainContents .textareaTxt{
margin-bottom: 46px;
}
.formMainContents .jobcheck{
margin-bottom: 15px;
}
.formMainContents .jobcheck:last-child{
margin-bottom: 21px;
}
.formMainContents .checkbox_chuusyaku{
margin-bottom: 45px;
}
.ownInfoPolicyBox{
padding: 34px 0 24px;
border: 1px solid #c9c9c9;
margin-bottom: 22px;
}
.ownInfoPolicyBox p{
padding: 0 23px;
height: 200px;
overflow-y: auto;
}
.ownInfoPolicyBox2{
padding: 34px 0 24px;
border: 1px solid #c9c9c9;
margin-bottom: 22px;
}
.ownInfoPolicyBox2_inner{
padding: 0 23px;
height: 200px;
overflow-y: auto;	
}
.ownInfoPolicyBox2 .box_top{
margin: 0 0 32px;
}
.ownInfoPolicyBox2 .box{
margin: 0 0 20px;
}
.ownInfoPolicyBox2 .box_ttl{
font-weight: bold;
}
.ownInfoPolicyBox2 .box_foot{
text-align: right;
}
.formMainContents .agreecheck{
text-align:center;
margin-bottom: 47px;
}
.formMainContents .submitBtn{
text-align:center;
}
.form_inputRadio{
margin-bottom: 50px;
}
.form_inputRadio input{
margin-left: 32px;
}
.form_inputRadio input:first-child{
margin-left: 0px;
}
.submitBtn .button2,
.submitBtn .button,
.submitBtn .submit{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding: 0;
border: none;
outline: none;
background: transparent;
width: 310px;
line-height: 60px;
border: solid 1px #388ac4;
background-color: #388ac4;
color: #fff;
font-size: 16px;
border-radius:8px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 107px;
cursor: pointer;
transition: all 300ms cubic-bezier(.165,.84,.44,1);
-webkit-transition: all 300ms cubic-bezier(.165,.84,.44,1);
-moz-transition: all 300ms cubic-bezier(.165,.84,.44,1);
}
.submitBtn .button{
background-color: #aaa;
border: solid 1px #aaa;
}
.submitBtn .button2{
background-color: #fff;
color: #388ac4;
}
.submitBtn .on{
display: inline-block;
}
.submitBtn .off{
display: none;
}
.submitBtn_off .on{
display: none;	
}
.submitBtn_off .off{
display: inline-block;	
}
.submitBtn .off:hover{
opacity: 1 !important;
cursor: default;
}
.form__itemNameCaption{
margin: -10px 0 15px;
padding-left: 13px;
}
.inputBottomAttention{
color: #727272;
font-size: 13px;
margin: -40px 0 50px 0;
}
.trial_aceptTxt{
font-size: 15px;
margin-bottom: 50px;
} .thanks_mes{
text-align: center;
padding-bottom: 70px;
} .errmes{
display: none;
opacity: 1;
color: #f63a52;
font-weight: bold;
padding: 6px 0;
}
.errmes_on{
display: block;
} @media screen and (min-width: 681px) and (orientation: portrait) ,screen and (min-width: 738px) and (orientation: landscape) {
.submitBtn .submit:hover{
background: #fff;
color: #388ac4;
}
.submitBtn .button2:hover{
background: #388ac4;
color: #fff;
}
}  @media screen and (max-width: 1720px){
.pageMainv--contact::after{
width: 90.4%;
}
}
@media screen and (max-width: 1480px){
.pageMainv--contact::after{
width: 95%;
}
} @media screen and (max-width: 680px) and (orientation: portrait) ,screen and (max-width: 737px) and (orientation: landscape) {
.thanks_mes{
text-align: left;
padding: 20px 0;
}
.pageMainv--contact{
height: 150px;
}
.pageMainv--contact::before{
height: 83.3%;
z-index: -2;
}
.pageMainv--contact::after{
width: 85.4%;
}
.contactMainTtl{
font-size: 30px;
}
.contactMainTtl .mini{
font-size: 14px;
}
.bigTtitle{
text-align: center;
font-size: 20px;
}
.bigTtitle::after{
content: "";
display: block;
width: 22px;
height: 6px;
border-bottom: 2px solid #388ac4;
margin: 0 auto 27px;
}
#recEntry{
}
.form_inner--contact{
padding-bottom: 66px;
}
.formBox{
box-shadow: none;
padding-top: 40px;
}
.formPagecatch__txt{
margin-bottom: 30px;
font-size: 15px;
text-align:left;
}
.status{
width: 85px;
height: 85px;
padding-top: 5px;
font-size: 12px;
}
.status::before{
width: 60px;
height: 60px;
}
.statusFlow{
max-width: 306px;
margin: 0 auto 30px;
}
.statusFlow::before{
width: 190px;
}
.submitBtn .button2,
.submitBtn .button,
.submitBtn .submit{
width: 100%;
line-height: 55px;
font-size: 13px;
border-radius:8px;
margin-left: 0;
margin-right: 0;
margin-bottom: 25px;
}
.submitBtn .button{
margin-bottom: 25px;
}
.form__itemNameCaption{
margin: -10px 0 10px;
padding-left: 0;
}
.form_inputRadio input{
margin-left: 10px;
}
.form_inputRadio input:first-child{
margin-left: 0px;
}
}
.formContent-wrap {
display:inline-flex;
width: 100%;
}
.formContent-wrap .desc img{
width:280px;
margin:auto;
display:block;
}
.formContent-wrap .desc h6{
text-align:center;
font-size: 16px;
margin: 20px auto;
}
.formContent-wrap .desc,
.formContent-wrap .from-content{
width:50%;
padding:20px;
}
.formContent-wrap .desc {
padding: 20px 40px;
}
.formContent-wrap .desc .desc_inner{
padding:  40px;
background:#ecf2f7;
}
@media screen and (max-width: 680px) and (orientation: portrait), screen and (max-width: 737px) and (orientation: landscape) {
.formContent-wrap{
display:block;
}
.formContent-wrap .desc,
.formContent-wrap .from-content{
width:100%;
padding:20px 0;
}
.formContent-wrap .desc h6 br {
display:none;
}
.formContent-wrap .desc p {
max-width:360px;
font-size:15px;
display:none;
}
.formContent-wrap .desc .desc_inner{
padding:  20px 10px;
}
}