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

/* FONT */
@font-face {
  font-family: 'Noto Serif JP';
  font-style: normal;
  font-weight: 400;
  src: local("Noto Serif Japanese"),
       local("Noto Serif CJK JP"),
       url('fonts/NotoSerifJP/NotoSerifJP-Regular.woff') format('woff'),
       url('fonts/NotoSerifJP/NotoSerifJP-Regular.ttf') format('truetype');
  font-display: swap;
}
@font-face {
  font-family: 'Noto Serif JP';
  font-style: normal;fz
  font-weight: 500;
  src: local("Noto Serif Japanese"),
       local("Noto Serif CJK JP"),
       url('fonts/NotoSerifJP/NotoSerifJP-Medium.woff') format('woff'),
       url('fonts/NotoSerifJP/NotoSerifJP-Medium.ttf') format('truetype');
  font-display: swap;
}

/* Default Style Reset --------------------------------------------------------------------------------------------------------- */
body,form,fieldset{margin: 0px;padding: 0px;}
body              {width: 100%;/*max-width: 1920px;*/position: relative;margin: 0 auto; }

fieldset          {border:none;}
h1,h2,h3,h4,h5,h6,p,pre,blockquote,ul,ol,dl,dd{margin: 0px;padding: 0px;}
blockquote,li,dt,dd{}
li                {list-style:none;}
input,textarea    {font-size: 1em;}s
img{border: 0px none;margin: 0;padding: 0;vertical-align: bottom;}

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

input[type="radio"],input[type="checkbox"]{position: relative;top: 1px;margin-right: 5px;}


/* Tag Castam ----------------------------------------------------------------------------------------------------------------- */
body              {font-family: "ヒラギノ角ゴ Pro W6", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
                   font-size: 80%;line-height: 150%;color: #3e3a39;font-feature-settings : "palt";}
em                {font-weight: normal;font-style: normal;}
strong            {}
a                 {text-decoration: none;color: #3E3A39;}
a:link            {}
a:hover           {text-decoration: none;}
a:visited         {}
a:active          {}
input,textarea    {padding: 5px;}
.sp               {display: none;}
.serif            {font-family: 游明朝, "Yu Mincho", YuMincho, 'Noto Serif JP', "Hiragino Mincho ProN", HGS明朝E, Georgia, serif;}
h1,h2,h3,h4,h5,h6 {font-family: 游明朝, "Yu Mincho", YuMincho, 'Noto Serif JP', "Hiragino Mincho ProN", HGS明朝E, Georgia, serif;font-weight: 500;}

html{height: 100%;}
body{height: 100%;}
footer           {background: #e1dcd5; }

.telico          {background: url(../img/tel_ico.gif) no-repeat left center; }
.mailico         {background: url(../img/mail_ico.gif) no-repeat left center;}
.flex            {display: flex;flex-wrap: wrap;}
.text            {line-height: 180%;font-size: 18px;}
.boxlist         {margin: 0 0 36px;}
.boxlist img     {display: block;}
.boxlist li      {width: 240px;margin: 0 28px 0 0;}
.boxlist li:nth-child(3n){margin: 0;}
.left_href       {width: 50%;}
.right_href      {width: 50%;margin: 0 0 0 auto; }
.container       {margin: 0 0 100px;}
.t_m             {margin-bottom: 30px;}
.t_center        {text-align: center;}
.dl_box          {justify-content: space-between;}
.dllist          {}
.dllist:after{width: 0;height: 0;margin: 0;padding: 0;content: "";display: block;clear :both;}
.dllist dt       {float: left;clear: both;}
.dllist dd       {padding: 0 0 0 100px;}
.dllist .dllist dt{ clear: none; }
.dllist .dllist dd{padding: 0 0 0 80px;}
.ent_btn         {text-align: center;}
.ent_btn a       {width: 90%;max-width: 475px;margin: 0 auto 45px;padding: 15px 30px;  border: 1px solid #152c55;color: #172e56;display: inline-block;position: relative;}
.btn a       {position: relative;z-index: 1;display: block;}
.btn a:hover {color: #fff; }
.btn a:after {content:"";display: block;width: 100%;height: 100%;background: #002b60;position: absolute;top: 0;left: 0;
                  transform: scale(0,1);transition: 0.2s;transform-origin: left;z-index: -1;}
.btn a:hover:after {transform: scale(1,1);transition: 0.2s;transform-origin: left;}
.btn .inner   {border: none;background: none;width: 100%;  }
.btn em       {width: 100%;width: 200px;margin: 0 auto;padding: 10px 0;position: relative;z-index: 1;display: block;border: 1px solid #002b60;}
.btn em:hover {color: #fff; }
.btn em:after {content:"";display: block;width: 100%;height: 100%;background: #002b60;position: absolute;top: 0;left: 0;
                  transform: scale(0,1);transition: 0.2s;transform-origin: left;z-index: -1;}
.btn em:hover:after {transform: scale(1,1);transition: 0.2s;transform-origin: left;}

.btn em:hover .inner{color: #fff;}


.ent_btn span    {line-height: 100%;padding: 0 20px 0 0; font-weight: bold;display: inline-block;font-size: 30px;background: url(../img/arrow_77.gif) no-repeat center right;}
#btn             {display: none;}

#head_box        {width: 100%;height: 100px;max-width: 980px;margin: 0 auto;
                  font-size: 14px;font-weight: bold;justify-content: space-between;
                  align-items: center;}
#head_box .right_box li{height: 30px;margin: 0 0 0 30px;padding: 0 0 0 40px;display: flex;align-items: center;}
#head_box .right_box li.sp{display: none; }
#nav             {height: 40px;align-items: center;justify-content: center;background: #002b60;}
#nav li          {margin: 0 0 0 1px;height: 100%;}
#nav a           {height: 100%;padding: 0 36px;color: #fff;display: flex;justify-content: space-between;align-items: center;position: relative;}
#nav a:hover     {background: #1564c5; }
#nav li a:after  {content: "";width: 1px;height: 80%;background: #fff;
                  position: absolute;right: -1px;}
#nav li:last-child a:after{display: none;}
#mainimg         {width: 100%;height: 600px;background: url(../img/20231003main.jpg) no-repeat center/auto 100%,#04042a;align-items: center;}
#mainimg .box    {width: 100%;max-width: 780px;margin: 0 auto;}

#wrap            {width: 100%;overflow: hidden;}
#wrap_inner            {width: 95%;max-width: 780px;margin: 0 auto 0;display: block; }
#wrap_inner h2         {margin: 0 0 35px;padding: 0 0 14px;font-size: 25px;border-bottom: 1px solid #3d62ad;color: #172e56;font-weight: bold;text-align: center;}
#wrap_inner h3         {margin: 0 0 30px;font-size: 36px;font-weight: bold;text-align: center;}
#wrap_inner h4         {margin: 0 0 14px;padding: 10px 0;font-size: 20px;color: #fff;text-align: center;background: #172e56; line-height: 100%;}
#wrap_inner .left_box  {width: 50%;}
#wrap_inner .right_box {width: 50%;text-align:right;}

#service         {}
#service .cont1  {margin: 0 0 70px;padding: 40px 0 0;}
#pla             {width: 50%;margin: 0 0 0 auto;}
#pla dl          {width: 100%;margin: 0 0 5px;padding: 0 0 5px;border-bottom: 1px dotted #ccc;display: flex;justify-content: space-between;}

#footbox         {width: 95%;max-width: 780px;margin: 0 auto;padding: 35px 0;}
#footbox:after   {width: 0;height: 0;margin: 0;padding: 0;content: "";display: block;clear :both;}
#footbox .left_box {float: left;width: 50%;}
#footbox .right_box{float: right;width: 50%;}
#copy            {padding: 30px 0;text-align: center;background: #030429;color: #fff;}

#foot_nav                      {margin: 0 0 16px;color: #030429;display: flex;justify-content: space-between;}
#foot_nav li                   {width: 25%;border-left: 1px solid #030429;box-sizing: border-box;}
#foot_nav li:last-child        {border-right: 1px solid #030429; }
#foot_nav a                    {text-align: center;color: #030429;font-weight: bold;display: block;line-height: 100%;}
#foot_nav a:hover              {text-decoration: underline; }
#footbox .btn_box              {justify-content: space-between;flex-wrap: wrap;}
#footbox .btn_box .btn         {width: 49%;}
#footbox .btn_box .btn a       {padding: 10px 0;text-align: center;background: #002b60;color: #fff;  }
#footbox .btn_box .btn a:hover {}
#footbox .btn_box .btn a:after {background: #315de0;}
#footbox .btn_box span         {padding: 0 0 0 30px;height: 35px;display: inline-block;line-height:35px;}

#footbox .btn_box .btn p       {padding: 10px 0;text-align: center;background: #002b60;color: #fff;  }
#footbox .btn_box .btn p:hover {}
#footbox .btn_box .btn p:after {background: #315de0;}



#footbox .btn_box .telico,#footbox .btn_box .mailico{background: none;}
#footbox .btn_box .telico span {background:url(../img/foot_tel.png) no-repeat center left;}
#footbox .btn_box .mailico span{background:url(../img/foot_mail.png) no-repeat center left;}
#footbox h2                    {margin: 0 0 10px;font-size: 20px;font-weight: bold;    align-items: center; }
#footbox  h2 em                {margin: 0 10px 0 0;font-size: 14px;}
#footbox .text                 {line-height: 150%;font-size: 14px;font-weight: bold;}


#service        {position: relative;z-index: 1;}
#service:after  {content: "";width: 1020px;height: 513px;z-index: -1;display: block;position: absolute;top: 0;left: 50%;}

#service .container        {position: relative;z-index: 1;}
#service .container:after  {content: "";z-index: -1;display: block;position: absolute;}
#service .cont1:after      {width: 1020px;height: 513px;background:url(../img/back1.png) no-repeat top left;top: 0;left: 50%;}
#service .cont2:after      {width: 700px;height: 429px;background:url(../img/back2.png) no-repeat top left;top: -175px;right: 55%;}
#service .cont3:after      {width: 660px;height: 682px;background:url(../img/back3.png) no-repeat top left;top: -175px;left: 55%;}


/* recruitbox */
#recruitbox                {width: 80%;height:300px;border: #C30 2px solid;margin: 0 auto; background:#FFC;}
#recruitbox  b             {color: #C30;}
#recruitbox .circle        {width: 100px;height: 100px;background-color: #C30;border-radius: 50%;
                            color: #FFF;font-size:40px; padding: 33px 0 0 0;position: relative;top: -30px;left:-20px;}
#recruitbox .txtbox        {position: relative;top: -80px;}


/* フェード処理 */
.fade             {opacity: 0;}
.fade.animeon     {opacity: 1;}
.up               {transform: translateY( 10%) ;transition:all 1.5s ease;}
.up.animeon       {transform: translateY( 0%);}
.down             {transform: translateY( -20%) ;transition:all 1.5s ease;}
.down.animeon     {transform: translateY( 0%) ;}
.leftin           {transform: translateX(-99%);transition:all 1s ease-out;overflow: hidden;} 
.leftin.animeon   {transform: translateX(0%);}
.rightin          {transform: translateX(99%);transition:all 1s ease-out;overflow: hidden;} 
.rightin.animeon  {transform: translateX(0%);}


#content section:first-of-type{padding: 40px 0 0;}

#form .dllist    {width: 100%;max-width: 600px;margin: 0 auto;padding: 30px 0 0;font-size:16px; }
#form .dllist dt {}
#form .dllist dd {margin: 0 0 30px;padding: 0 0 0 150px;}
#form .dllist ul {}
#form .dllist li {margin: 0 0 10px; }
.w1              {width: 100%;max-width: 200px;}
.w2              {width: 100%;max-width: 400px;}
.w3              {width: 100%;max-width: 600px;}
.w4              {width: 100%;max-width: 100px;}
.center          {text-align: center;}

#pres            {display: flex;justify-content: flex-end;text-align: right; font-weight: bold;
                  font-family: 游明朝, "Yu Mincho", YuMincho, 'Noto Serif JP', "Hiragino Mincho ProN", HGS明朝E, Georgia, serif;font-weight: bold;font-size: 22px; }
#pres em         {font-size: 14px;    margin: 0 10px 0 0;}

@media screen and (max-width: 768px) {
*                            {-webkit-appearance: none;-webkit-text-size-adjust: 100%;}
img                         {width: auto;max-width: 100%; }
.pc                        {display: none;}
.sp                        {display: block;}
/*三本線*/
#btn                                {display: block;position: fixed;top: 10px;right: 10px;z-index: 1001; transition: .2s;}
#btn button:after                   {content: "";width:20px;height: 10px;border: 2px solid #04465e;border-width: 0 0 2px;display: inline-block;box-sizing: border-box; position: absolute; top: 6px; right: 0;transition: .2s;}
#btn button:before                  {content: "";width:20px;height: 7px;border: 2px solid #04465e;border-width: 2px 0;display: inline-block;box-sizing: border-box; position: absolute; top: 4px; right: 0;transition: .2s;}
#btn button {height: 20px;width: 20px;display: block;text-indent:-999em;position: relative;z-index: 101;background: none;border: none;}
.hidden #btn button:after           {transform:rotate(45deg);transform-origin: 100%;top: 10px;transition: .2s; border-color: #fff;}
.hidden #btn button:before          {transform:rotate(-45deg);transform-origin: 100%;border-width: 2px 0 0; top: 2px;transition: .2s;border-color: #fff;}
#nav_back                           {
width: -webkit-calc(100% + 20px);width : calc(100% + 8px) ;
height: -webkit-calc(100% + 20px);height : calc(100% + 8px) ;
margin:auto;
transform: translateX(51%);
top: 0;bottom: 0;right: 50%;

content: "";position: absolute;top: 0;background: #fff;display: block;}

.btn_active #nav_back{background: none;}


#mainimg                     { height:500px;}
#mainimg img                 { width:70%;}

#overlay                     {height: 100%; position: fixed;top: 0;right: -150%;transition: .2s;overflow: hidden;z-index: 1000;}
#overlay.open                {width: 50%;right: 0;transition: .2s;}
#head_box .right_box li.pc{display: none; }
#head_box .right_box li.sp{display: flex; }
#nav                         {padding: 100px 0 0;display: block;height: 100%}
#nav li                      {height: 40px; }

#head_box                    {height: auto;padding: 10px ; display: block; }
h1                           {margin: 0 0 10px;text-align: center;display: block;}
.left_href                   {width: 100%;}
.right_href                  {width: 100%;}

.boxlist li                  {width: 100%;margin: 0 auto 30px; }
.boxlist img                  {margin:0 auto 20px;}
#mainimg .box                {width: 80%}
#pla                          {width: 100%;}
#pla                         {width: 98%;margin: 0 auto;}
#pla dl                      {width: 100%;margin: 0 0 10px;padding: 0 10px 10px;
                              border-bottom: 1px solid #ccc;display: flex;justify-content: space-between;}
#wrap_inner .left_box        {width: 100%;  }
#wrap_inner .right_box       {width: 100%; }

#company .left_box           {margin: 0 0 20px;}
#company .right_box  li      {margin: 0 0 10px;}

#footbox h2                  {justify-content: center;}
#footbox .left_box           {margin: 0 0 10px;float: none;width: 100%;text-align:center;}
#footbox .right_box          {float: none;width: 100%;}

#wrap_inner h2         {font-size: 20px;}
#wrap_inner h3         {font-size: 18px;line-height: 100%;}
#wrap_inner h4         {font-size: 16px;padding: 8px 0;margin: 0 0 30px; }


.text                         {font-size: 14px;}


#footbox .btn_box .btn a       {padding: 0;}

#service .container:after  {display: none;}
input[type="radio"]        {display:none}


.radiolabel                  {position:relative;padding: 0 0 0 30px;font-size: 14px; }
.radiolabel:after,.radiolabel:before            {content:"";width:20px;height:20px;margin: auto;background:#fff;border: 1px solid #ccc;border-radius: 100px;position: absolute;top: 0;bottom: 0;left: 5px;        }

input[type="radio"]:checked + .radiolabel:after          {width: 14px;height: 14px;left: 8px  ; background: #1f4573; }

#service .cont1              { padding:20px 0 0 0;}

}

@media screen and (max-width: 570px) {
#mainimg                     { height:500px;}
}


@media screen and (max-width: 428px) {
header h1 img                 { width:80%;}

#mainimg                     { height:300px;}

}