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

/*body*/
#wrapper {display: flex; flex-direction: column; box-sizing: border-box; min-height: 100vh;}
.wrap {width: 100%; margin: 0; padding: 0; float: left;}
.wbody {width: 96%; max-width: 980px; margin: 0 auto; padding: 0;}

.type1 {background: #000000;}
    .type1sub {background: #1D1D1D;}
.type2 {background: #006cba;}
    .type2sub {background: #3198E3;}
.type3 {background: #40933b;}
    .type3sub {background: #7dceb9;}
    
.type1stripe {background-size: auto auto;
    background-color: rgba(29, 29, 29, 1);
    background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(80, 80, 80, 1) 5px, rgba(80, 80, 80, 1) 6px );}
.type1stripe2 {background-size: auto auto;
    background-color: rgba(149, 149, 149, 1);
    background-image: repeating-linear-gradient(135deg, transparent, transparent 2px, rgba(117, 117, 117, 1) 2px, rgba(117, 117, 117, 1) 4px );}

.type2stripe {background-size: auto auto;
    background-color: rgba(60, 134, 187, 1);
    background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(54, 105, 175, 1) 5px, rgba(54, 105, 175, 1) 6px );}
.type2stripe2 {background-size: auto auto;
    background-color: rgba(0,83,138,1);
    background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(54, 105, 175, 1) 5px, rgba(54, 105, 175, 1) 6px );}

.type3stripe {background-size: auto auto;
    background-color: rgba(64, 147, 59, 1);
    background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(80, 80, 80, 1) 5px, rgba(80, 80, 80, 1) 6px );}
.type3stripe2 {background: #40933b;}
        
        
/*PC:body-------------------------------------*/
@media screen and (min-width:1084px) {
	.pc {display: block !important;}
	.tb {display: none !important;}
	.sp {display: none !important;}
    
    /* header */
    header {width: 100%; margin: 0 auto; padding: 0 0 20px; border-bottom: solid 1px #CCCCCC;}
    header h1 {width: 100%; margin: 0; padding: 3px 0; font-size: 12px; color: #FFFFFF; font-weight: 500; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    .hedtitle {width: 100%; margin: 0; padding: 3px 5px 3px 0; font-size: 12px; color: #FFFFFF; text-align: right; box-sizing: border-box; float: left;}
    
    #hedinfo {width: 100%; margin: 0; padding: 8px 0; float: left; background: #FFFFFF;}
    #hedinfo ul {width: 700px; margin: 0; padding: 0; float: right;}
    #time {width: 420px; height: 30px; line-height: 30px; margin: 0; padding: 0; color: #685D40; float: left; text-align: right;  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    #call {width: 280px; height: 30px; line-height: 30px; margin: 0; padding: 0; color: #685D40; float: left; text-align: center; font-size: 24px;}
    /* TYPE1 */
    #hedname {width: 100%; margin: 0; padding: 10px 0 30px; float: left; background: #f2f2ec;}
    #hedname ul {width: 100%; margin: 0; padding: 0; float: left;}
    /* TYPE2 */
    #hedname2 {width: 100%; margin: 0; padding: 10px 0 30px; float: left; background: #FFFFFF;}
    #hedname2 ul {width: 100%; margin: 0; padding: 0; float: left;}
    
    #conpanyname {width: 100%; margin: 0; padding: 8px 0; font-size: 30px; line-height: 30px; text-align: center;}
    #conpanysub {width: 100%; margin: 0; padding: 0; font-size: 18px; line-height: 18px; text-align: center;}
    
    /* TYPE1 */
    #hednav {width: 100%; height: 60px; margin: 12px 0; padding: 0; float: left;}
    #hednav ul {width: 100%; max-width: 1200px;  list-style-type: none; padding-left: 0px; margin: 0px auto;}
    #hednav ul li {float: left; width: 25%; width: calc( 100% / 4);}
    #hednav ul li a {float: left; padding: 8px 0; line-height: 20px; width: 100%; color: #2D2D2D; font-family: "メイリオ"; font-size: 16px; text-align: center; border-right: solid 1px #CCCCCC; border-left: solid 1px #CCCCCC; background: #FFFFFF; box-sizing: border-box;}
    #hednav ul li a:hover {float: left; padding: 8px 0; line-height: 20px; width:100%; font-family: "メイリオ"; font-size: 16px; text-align: center; text-decoration: none; background: #f2f2ec; color: #000000; box-sizing: border-box;}
    #hednav ul li p {font-size: 12px;}
    /* TYPE2 */
    #hednav2 {width: 100%; height: 60px; margin: 12px 0; padding: 0; float: left;}
    #hednav2 ul {width: 100%; max-width: 1200px;  list-style-type: none; padding-left: 0px; margin: 0px auto;}
    #hednav2 ul li {float: left; width: 25%; width: calc( 100% / 4);}
    #hednav2 ul li a {float: left; padding: 8px 0; line-height: 20px; width: 100%; color: #2D2D2D; font-family: "メイリオ"; font-size: 16px; text-align: center; border-right: solid 1px #CCCCCC; border-left: solid 1px #CCCCCC; background: #FFFFFF; box-sizing: border-box;}
    #hednav2 ul li a:hover {float: left; padding: 8px 0; line-height: 20px; width:100%; font-family: "メイリオ"; font-size: 16px; text-align: center; text-decoration: none; background: #0991E8; color: #FFFFFF; box-sizing: border-box;}
    #hednav2 ul li p {font-size: 12px;}
    
    /* nav */
    .toggleSpc {display: none !important;}
    .toggle {display: none !important;}
    #nav {display: none !important;}
    
    #bNav {display: none !important;}
    .bRgba {display: none !important;}
    
    /* contents */
    #topimg {width: 100%; margin: 0; padding: 0; float: left; position: relative;}
    #topimg img {width: 100%; margin: 0; padding: 0; line-height: 0;}
    #topimg p {position: absolute; top: 8%; left: 10%; color: #FFFFFF; font-weight: bold; font-size: 1.5vw;
    text-shadow: 
       1px  1px 4px rgba(153, 153, 153, 0.60),
      -1px  1px 4px rgba(153, 153, 153, 0.60),
       1px -1px 4px rgba(153, 153, 153, 0.60),
      -1px -1px 4px rgba(153, 153, 153, 0.60),
       1px  0px 4px rgba(153, 153, 153, 0.60),
       0px  1px 4px rgba(153, 153, 153, 0.60),
      -1px  0px 4px rgba(153, 153, 153, 0.60),
       0px -1px 4px rgba(153, 153, 153, 0.60);
    }
    
    .line {width: 100%; margin: 20px 0 0; padding: 8px 0 8px 8px; box-sizing: border-box; font-size: 14px; color: #FFFFFF; float: left;}
    
    #infowrap {width: 100%; margin: 10px 0; padding: 20px 0; float: left; background: #f2f2ec;}
    #info {width: 96%; max-width: 980px; max-height: 480px; overflow-y: scroll; margin: 0 auto; padding: 0;}
    #infoline {width: 100%; margin: 0; padding: 8px 0 8px 20px; box-sizing: border-box; color: #FFFFFF; float: left;}
    #infospc {width: 100%; max-width: 980px; margin: 0; padding: 10px 20px 28px; box-sizing: border-box; border: solid 1px #1D1D1D; background: #FFFFFF; float: left;}
    #infospc ul {width: 100%; padding: 0; float: left;}
    .newstime {width: 100%; color: #002EE1; font-size: 16px; margin: 0 0 8px; font-weight: bold; float: left;}
    .newstitle {width: 100%; color: #1D1D1D; font-size: 14px; font-weight: bold; float: left;}
    .newstext {width: 100%; margin: 0 0 50px; padding: 8px 0 16px; border-bottom: dotted 1px #8C8C8C; float: left;}
        
    #twowrap {width: 100%; margin: 0 0 80px; float: left;}
    #twobox {width: 100%; max-width: 980px; margin: 0 auto;}
    #left {width: 50%; float: left;}
    #right {width: 50%; float: left;}
    /* left*/
    .texttitle {width: 98%; margin: 0 1%; padding: 8px 0 8px 5px; box-sizing: border-box; float: left; font-size: 16px; color: #685D40;}
    .leftimg {width: 98%; margin: 0 1%; float: left;}
    .leftimg img {width: 100%; margin: 0; padding: 0; line-height: 0; float: left;}
    .text01 {width: 96%; margin: 15px 2%; font-size: 14px; float: left;}
    .text02 {width: 96%; margin: 15px 2%; font-size: 18px; float: left;}
    /* right */
    #conpany {width: 98%; margin: 0 1%; padding: 0; float: left;}
    #conpany table {width: 100%; margin: 0; padding: 0; text-align: center; float: left;}
    .conpanytitle {padding: 8px; color: #FFFFFF; font-weight: 500; font-size: 16px;}
    #conpany table th {padding: 8px 0; color: #FFFFFF; font-weight: 500; font-size: 14px;}
    #conpany table td {padding: 8px 0 8px 5px; color: #1D1D1D; font-size: 14px; border: solid 1px #CCCCCC; text-align: left;}
    
    #bcwrap {width: 100%; margin: 10px 0; padding: 0; border: solid 1px #FFFFFF; box-sizing: border-box; float: left;}
    #bctitle {width: 100%; padding: 8px 0; text-align: center; color: #FFFFFF; font-size: 16px; float: left;}
    #bctext {width: 100%; padding: 8px 5px; border: solid 1px #000000; box-sizing: border-box; font-size: 14px; float: left;}
    
    /* twocenter*/
    #twocenter {width: 100%; margin: 0; padding: 0; float: left;}
    #acctitle {width: 100%; margin: 0; padding: 8px 0 8px 30px; box-sizing: border-box; float: left; color: #FFFFFF;}
    #map {width: 100%; height: 402px; margin: 0; padding: 0; float: left; border: solid 1px #1D1D1D; box-sizing: border-box;}
    .gmap {width: 100%; height: 400px;}
    
    /* recruit */
    #rectb {width: 100%; margin: 20px auto; padding: 0; border: solid 1px #1D1D1D; float: left;}
    .rectitle {height: 38px; line-height: 38px; font-size: 18px; text-align: center; color: #FFFFFF;}
    #rectb th {width: 25%; padding: 8px; font-size: 14px; font-weight: 500; color: #FFFFFF;}
    #rectb td {width: 75%; padding: 8px; font-size: 14px; box-sizing: border-box; border:  solid 1px #9B9B9B;}
    
    /*footer*/
    footer {width: 100%; margin: auto 0 0; padding: 0; background: #f2f2ec; float: left;}
    #ftop {width: 100%; margin: 0; padding: 8px 0; text-align: center; font-size: 14px; color: #FFFFFF;}
    #fwrap {width: 100%; max-width: 980px; margin: 0 auto; padding: 15px 0;}
    #sitemap {width: 40%; float: left; border: solid 1px #1D1D1D; box-sizing: border-box; border-radius: 5px;}
    #sitemap ul {width: 96%; margin: 10px 2%; padding: 0 0 20px; float: left;}
    #sitemap ul li {width: 96%; margin: 8px 2%; padding: 0 5px; box-sizing: border-box; border-bottom: dotted 1px #1D1D1D;}
    #sitemap ul li a {width: 100%; font-size: 14px; color: #000000;}
    #smtitle {width: 100%; padding: 8px 0; font-size: 14px; color: #FFFFFF;}
    
    #fcopany {width: 60%; float: left;}
    #fcopany ul {width: 96%; margin: 10px 2% 0; padding: 0; float: left;}
    #fcopany ul li {}
    #fctitle {text-align: right; color: #9F802F; font-size: 14px; font-weight: bold;}
    #fcname {text-align: right; font-size: 34px; line-height: 34px; padding: 8px 0 0;}
    #fcsubname {text-align: right; font-size: 16px;}
    #fcadd {text-align: right; font-size: 16px;}
    #fccall {text-align: right; font-size: 16px;}
    #fcmail {text-align: right; font-size: 16px;}
    #fcurl {text-align: right; font-size: 16px;}
    
    #copyright {width: 100%; margin: 20px 0 0; padding: 15px 0; text-align: center; font-size: 12px; line-height: 14px; float: left; color: #FFFFFF;}
    
    .up {position: fixed; z-index: 90; bottom: -100px; right: 3%; border-radius: 50%; cursor: pointer;}
    .up span {position: relative; height: 54px; width: 54px; display: block; border-radius: 50%; text-shadow: 0 2px 5px rgba(244,74,79,.4), 0 2px 5px rgba(0,0,0,.2); box-shadow: 0 6px 17px -7px rgba(244,74,79,.8); background: #f7685f; background: -moz-linear-gradient(top, #f7685f 7%, #e54749 68%); background: -webkit-linear-gradient(top, #f7685f 7%, #e54749 68%);
  background: linear-gradient(to bottom, #f7685f 7%, #e54749 68%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7685f', endColorstr='#e54749',GradientType=0 );
  -webkit-transition: 0.7s cubic-bezier(0.33, 1, 0.68, 1); transition: 0.7s cubic-bezier(0.33, 1, 0.68, 1);}
    .up span:before, .up span:after {content: ""; position: absolute; top: 49%; width: 32%; height: 3px; background: #fff; display: block; border-radius: 12px;}
    .up span:before {left: 24%; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg);}
    .up span:after {right: 24%; -webkit-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg);}
    .up span:hover {-webkit-transform: translateY(-5%); transform: translateY(-5%); box-shadow: 0 10px 20px -6px rgba(244, 74, 79, 0.6); opacity: .8;}
    
}

/*TB:body-------------------------------------*/
@media screen and (min-width: 560px) and (max-width: 1083px) {
	.pc {display: none !important;}
	.tb {display: block !important;}
	.sp {display: none !important;}
    
    header {width: 100%; margin: 0 auto; padding: 0 0 20px; border-bottom: solid 1px #CCCCCC;}
    header h1 {width: 100%; margin: 0; padding: 3px 0; font-size: 12px; color: #FFFFFF; font-weight: 500; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    .hedtitle {width: 100%; margin: 0; padding: 3px 5px 3px 5px; font-size: 12px; color: #FFFFFF; text-align: center; box-sizing: border-box; float: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    
    #hedinfo {width: 100%; margin: 0; padding: 8px 0; float: left; background: #FFFFFF;}
    #hedinfo ul {width: 700px; margin: 0; padding: 0; float: right;}
    #time {width: 420px; height: 30px; line-height: 30px; margin: 0; padding: 0; color: #685D40; float: left; text-align: right;  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    #call {width: 280px; height: 30px; line-height: 30px; margin: 0; padding: 0; color: #685D40; float: left; text-align: center; font-size: 24px;}
    
    #hedname {width: 100%; margin: 0; padding: 10px 0 30px; float: left; background: #f2f2ec;}
    #hedname ul {width: 100%; margin: 0; padding: 0; float: left;}
    #conpanyname {width: 100%; margin: 0; padding: 8px 0; font-size: 30px; line-height: 30px; text-align: center;}
    #conpanysub {width: 100%; margin: 0; padding: 0; font-size: 18px; line-height: 18px; text-align: center;}
    
    /* TYPE1 */
    #hednav {width: 100%; height: 60px; margin: 12px 0; padding: 0; float: left;}
    #hednav ul {width: 100%; list-style-type: none; padding-left: 0px; margin: 0;}
    #hednav ul li {float: left; width: 25%; width: calc( 100% / 4);}
    #hednav ul li a {float: left; padding: 8px 0; line-height: 20px; width: 100%; color: #2D2D2D; font-family: "メイリオ"; font-size: 16px; text-align: center; border-right: solid 1px #CCCCCC; border-left: solid 1px #CCCCCC; background: #FFFFFF; box-sizing: border-box;}
    #hednav ul li a:hover {float: left; padding: 8px 0; line-height: 20px; width: 100%; font-family: "メイリオ"; font-size: 16px; text-align: center; text-decoration: none; background: #f2f2ec; color: #000000; box-sizing: border-box;}
    #hednav ul li p {font-size: 12px;}
    /* TYPE2 */
    #hednav2 {width: 100%; height: 60px; margin: 12px 0; padding: 0; float: left;}
    #hednav2 ul {width: 100%; list-style-type: none; padding-left: 0px; margin: 0;}
    #hednav2 ul li {float: left; width: 25%; width: calc( 100% / 4);}
    #hednav2 ul li a {float: left; padding: 8px 0; line-height: 20px; width: 100%; color: #2D2D2D; font-family: "メイリオ"; font-size: 16px; text-align: center; border-right: solid 1px #CCCCCC; border-left: solid 1px #CCCCCC; background: #FFFFFF; box-sizing: border-box;}
    #hednav2 ul li a:hover {float: left; padding: 8px 0; line-height: 20px; width: 100%; font-family: "メイリオ"; font-size: 16px; text-align: center; text-decoration: none; background: #f2f2ec; color: #000000; box-sizing: border-box;}
    #hednav2 ul li p {font-size: 12px;}
    
    /* nav */
    .toggleSpc {display: none !important;}
    .toggle {display: none !important;}
    #nav {display: none !important;}
    
    #bNav {display: none !important;}
    .bRgba {display: none !important;}
    
    /* contents */
    #topimg {width: 100%; margin: 0; padding: 0; float: left; position: relative;}
    #topimg img {width: 100%; margin: 0; padding: 0; line-height: 0;}
    #topimg p {position: absolute; top: 8%; left: 10%; color: #FFFFFF; font-weight: bold; font-size: 3vw;
    text-shadow: 
       1px  1px 4px rgba(153, 153, 153, 0.60),
      -1px  1px 4px rgba(153, 153, 153, 0.60),
       1px -1px 4px rgba(153, 153, 153, 0.60),
      -1px -1px 4px rgba(153, 153, 153, 0.60),
       1px  0px 4px rgba(153, 153, 153, 0.60),
       0px  1px 4px rgba(153, 153, 153, 0.60),
      -1px  0px 4px rgba(153, 153, 153, 0.60),
       0px -1px 4px rgba(153, 153, 153, 0.60);
    }
    
     .line {width: 100%; margin: 20px 0 0; padding: 8px 0 8px 8px; box-sizing: border-box; font-size: 14px; color: #FFFFFF; float: left;}
    
    #infowrap {width: 100%; margin: 10px 0; padding: 20px 0; float: left; background: #f2f2ec;}
    #info {width: 96%; max-width: 980px; max-height: 480px; overflow-y: scroll; margin: 0 auto; padding: 0;}
    #infoline {width: 100%; margin: 0; padding: 8px 0 8px 20px; box-sizing: border-box; color: #FFFFFF; float: left;}
    #infospc {width: 100%; max-width: 980px; margin: 0; padding: 10px 20px 28px; box-sizing: border-box; border: solid 1px #1D1D1D; background: #FFFFFF; float: left;}
    #infospc ul {width: 100%; padding: 0; float: left;}
    .newstime {width: 100%; color: #002EE1; font-size: 16px; margin: 0 0 8px; font-weight: bold; float: left;}
    .newstitle {width: 100%; color: #1D1D1D; font-size: 14px; font-weight: bold; float: left;}
    .newstext {width: 100%; margin: 0 0 50px; padding: 8px 0 16px; border-bottom: dotted 1px #8C8C8C; float: left;}
    
    #twoWrap {width: 100%; float: left;}
    #twobox {width: 100%; max-width: 980px; margin: 0 auto;}
    #left {width: 96%; margin: 0 2%; float: left;}
    #right {width: 96%; margin: 0 2%; float: left;}
    /* left*/
    .texttitle {width: 98%; margin: 0 1%; padding: 8px 0 8px 5px; box-sizing: border-box; float: left;font-size: 16px; color: #685D40;}
    .leftimg {width: 98%; margin: 0 1%; float: left;}
    .leftimg img {width: 100%; margin: 0; padding: 0; line-height: 0; float: left;}
    .text01 {width: 96%; margin: 15px 2%; font-size: 14px; float: left;}
    .text02 {width: 96%; margin: 15px 2%; font-size: 18px; float: left;}
    /* right */
    #conpany {width: 100%; margin: 0; padding: 0; float: left;}
    #conpany table {width: 100%; margin: 0; padding: 0; text-align: center; float: left;}
    .conpanytitle {padding: 8px; color: #FFFFFF; font-weight: 500; font-size: 16px;}
    #conpany table th {padding: 8px 0; color: #FFFFFF; font-weight: 500; font-size: 14px;}
    #conpany table td {padding: 8px 0 8px 5px; color: #1D1D1D; font-size: 14px; border: solid 1px #CCCCCC; text-align: left;}
    
    #bcwrap {width: 100%; margin: 10px 0; padding: 0; border: solid 1px #FFFFFF; box-sizing: border-box; float: left;}
    #bctitle {width: 100%; padding: 8px 0; text-align: center; color: #FFFFFF; font-size: 16px; float: left;}
    #bctext {width: 100%; padding: 8px 5px; border: solid 1px #000000; box-sizing: border-box; font-size: 14px; float: left;}
    
    /* twocenter*/
    #twocenter {width: 100%; margin: 0; padding: 0; float: left;}
    #acctitle {width: 96%; margin: 0 2%; padding: 8px 0 8px 30px; box-sizing: border-box; float: left; color: #FFFFFF;}
    #map {width: 96%; height: 402px; margin: 0 2% 20px; padding: 0; float: left; border: solid 1px #1D1D1D; box-sizing: border-box;}
    .gmap {width: 100%; height: 400px; margin: 0; padding: 0;}
    
    /* recruit */
    #rectb {width: 100%; margin: 20px auto; padding: 0; border: solid 1px #1D1D1D; float: left;}
    .rectitle {height: 38px; line-height: 38px; font-size: 18px; text-align: center; color: #FFFFFF;}
    #rectb th {width: 25%; padding: 8px; font-size: 14px; font-weight: 500; color: #FFFFFF;}
    #rectb td {width: 75%; padding: 8px; font-size: 14px; box-sizing: border-box; border:  solid 1px #9B9B9B;}
    
    /*footer*/
    footer {width: 100%; margin: auto 0 0; padding: 0; background: #f2f2ec; float: left;}
    #ftop {width: 100%; margin: 0; padding: 8px 0; text-align: center; font-size: 14px; color: #FFFFFF;}
    #fwrap {width: 100%; max-width: 980px; margin: 0 auto; padding: 15px 0;}
    
    #sitemap {width: 39%; margin: 0 0 0 1%; float: left; border: solid 1px #1D1D1D; box-sizing: border-box; border-radius: 5px;}
    #sitemap ul {width: 96%; margin: 10px 2%; padding: 0 0 20px; float: left;}
    #sitemap ul li {width: 96%; margin: 8px 2%; padding: 0 5px; box-sizing: border-box; border-bottom: dotted 1px #1D1D1D;}
    #sitemap ul li a {width: 100%; font-size: 14px; color: #000000;}
    #smtitle {width: 100%; padding: 8px 0; font-size: 14px; color: #FFFFFF;}
    
    #fcopany {width: 59%; margin: 0 1% 0 0; float: left;}
    #fcopany ul {width: 96%; margin: 10px 2% 0; padding: 0; float: left;}
    #fcopany ul li {}
    #fctitle {text-align: right; color: #9F802F; font-size: 14px; font-weight: bold;}
    #fcname {text-align: right; font-size: 24px; line-height: 30px; padding: 8px 0 0;}
    #fcsubname {text-align: right; font-size: 16px;}
    #fcadd {text-align: right; font-size: 16px;}
    #fccall {text-align: right; font-size: 16px;}
    #fcmail {text-align: right; font-size: 16px;}
    #fcurl {text-align: right; font-size: 16px;}
    
    #copyright {width: 100%; margin: 20px 0 0; padding: 15px 0; text-align: center; font-size: 12px; line-height: 14px; float: left; color: #FFFFFF;}
    
    .up {position: fixed; z-index: 90; bottom: -100px; right: 3%; border-radius: 50%; cursor: pointer;}
    .up span {position: relative; height: 54px; width: 54px; display: block; border-radius: 50%; text-shadow: 0 2px 5px rgba(244,74,79,.4), 0 2px 5px rgba(0,0,0,.2); box-shadow: 0 6px 17px -7px rgba(244,74,79,.8); background: #f7685f; background: -moz-linear-gradient(top, #f7685f 7%, #e54749 68%); background: -webkit-linear-gradient(top, #f7685f 7%, #e54749 68%);
  background: linear-gradient(to bottom, #f7685f 7%, #e54749 68%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7685f', endColorstr='#e54749',GradientType=0 );
  -webkit-transition: 0.7s cubic-bezier(0.33, 1, 0.68, 1); transition: 0.7s cubic-bezier(0.33, 1, 0.68, 1);}
    .up span:before, .up span:after {content: ""; position: absolute; top: 49%; width: 32%; height: 3px; background: #fff; display: block; border-radius: 12px;}
    .up span:before {left: 24%; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg);}
    .up span:after {right: 24%; -webkit-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg);}
    .up span:hover {-webkit-transform: translateY(-5%); transform: translateY(-5%); box-shadow: 0 10px 20px -6px rgba(244, 74, 79, 0.6); opacity: .8;}
    
}

/*SP:body-------------------------------------*/
@media screen and (max-width: 559px) {
	.pc {display: none !important;}
	.tb {display: none !important;}
	.sp {display: block !important;}
    
    header {width: 100%; margin: 0 auto; padding: 0 0 20px; border-bottom: solid 1px #CCCCCC;}
    header h1 {width: 100%; margin: 0; padding: 8px 0 0; font-size: 12px; color: #FFFFFF; font-weight: 500; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    .hedtitle {width: 100%; margin: 0; padding: 3px 5px 3px 5px; font-size: 12px; color: #FFFFFF; text-align: right; box-sizing: border-box; float: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    
    #hedinfo {width: 100%; margin: 0; padding: 8px 0; float: left; background: #FFFFFF;}
    #hedinfo ul {width: 100%; margin: 0; padding: 0; float: left;}
    #time {width: 100%; height: 30px; line-height: 30px; margin: 0; padding: 0 8px 0 0; box-sizing: border-box; color: #685D40; float: left; text-align: right; font-size: 16px;}
    #call {width: 100%; height: 30px; line-height: 30px; margin: 0; padding: 0 8px 0 0; box-sizing: border-box; color: #685D40; float: left; text-align: right; font-size: 18px;}
    
    #hedname {width: 100%; margin: 0; padding: 10px 0 30px; float: left; background: #f2f2ec;}
    #hedname ul {width: 100%; margin: 0; padding: 0; float: left;}
    #conpanyname {width: 100%; margin: 0; padding: 8px 0; font-size: 26px; line-height: 26px; text-align: center;}
    #conpanysub {width: 100%; margin: 0; padding: 0; font-size: 16px; line-height: 16px; text-align: center;}
    
    /* TYPE1 */
    #hednav {width: 100%; height: 60px; margin: 12px 0; padding: 0; float: left;}
    #hednav ul {width: 100%; list-style-type: none; padding-left: 0px; margin: 0px auto;}
    #hednav ul li {float: left; width: 25%; width: calc( 100% / 4);}
    #hednav ul li a {float: left; padding: 8px 0; line-height: 20px; width: 100%; color: #2D2D2D; font-family: "メイリオ"; font-size: 14px; text-align: center; border-right: solid 1px #CCCCCC; border-left: solid 1px #CCCCCC; background: #FFFFFF; box-sizing: border-box;}
    #hednav ul li a:hover {float: left; padding: 8px 0; line-height: 20px; width:100%; font-family: "メイリオ"; font-size: 14px; text-align: center; text-decoration: none; background: #f2f2ec; color: #000000; box-sizing: border-box;}
    #hednav ul li p {font-size: 12px;}
    /* TYPE2 */
    #hednav2 {width: 100%; height: 60px; margin: 12px 0; padding: 0; float: left;}
    #hednav2 ul {width: 100%; list-style-type: none; padding-left: 0px; margin: 0px auto;}
    #hednav2 ul li {float: left; width: 25%; width: calc( 100% / 4);}
    #hednav2 ul li a {float: left; padding: 8px 0; line-height: 20px; width: 100%; color: #2D2D2D; font-family: "メイリオ"; font-size: 14px; text-align: center; border-right: solid 1px #CCCCCC; border-left: solid 1px #CCCCCC; background: #FFFFFF; box-sizing: border-box;}
    #hednav2 ul li a:hover {float: left; padding: 8px 0; line-height: 20px; width:100%; font-family: "メイリオ"; font-size: 14px; text-align: center; text-decoration: none; background: #f2f2ec; color: #000000; box-sizing: border-box;}
    #hednav2 ul li p {font-size: 12px;}
    
    /* nav */
    /*toggleStyle*/
    .toggleSpc {display: block; position: fixed; top: 0; width: 100%; height: 68px; z-index: 9998; background: #FFFFFF; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); overflow-x: hidden;}
    
    #logo {width: 240px; height: 68px; float: left; font-family: 'Lora', serif;}
    #logo a {width: 240px; height: 68px; float: left; margin: 18px 0 0 15px; font-family: 'Lora', serif; font-size: 18px; line-height: 18px; font-weight: bold; color: #242424; text-decoration: none;}
    #logo p {font-family: 'Lora', serif; font-size: 14px; line-height: 14px;}
    .call {display: block; position: fixed; right: 68px; top: 10px; width: 50px; height: 50px; cursor: pointer; z-index: 9999; background: #FFFFFF; text-align: center; border-radius: 5px;}
    .call a img {width: 50px;}
     
    .toggle {display: block; position: fixed; right: 13px; top: 8pt; width: 48px; height: 48px; cursor: pointer; z-index: 9999; background: #FFFFFF; text-align: center; border-radius: 5px; border: solid 1px #405C3C;}
    .toggle span {display: block; position: absolute; width: 35px; border-bottom: solid 2px #405C3C; -webkit-transition:.35s ease-in-out; -moz-transition:.35s ease-in-out; transition:.35s ease-in-out; left: 6px;}
    .toggle span:nth-child(1) {top: 9px;}
    .toggle span:nth-child(2) {top: 18px;}
    .toggle span:nth-child(3) {top: 27px;}
     
    .toggle.active span:nth-child(1) {top: 18px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg);}
    .toggle.active span:nth-child(2),
    .toggle.active span:nth-child(3) {top: 18px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg);}
    .toggle span:nth-child(4){border: 0; color: #405C3CD; font-size: 9px; font-weight: 700; top: 32px}
    
    #nav {position: fixed; margin-top: 70px; top: 0; right: 0; width: 300px; height: calc(100% - 70px); background-color: rgba(255,255,255,0.9); transition: all 0.2s; transform: translate(300px); z-index: 1000; border-left: solid 1px #CCC; overflow-y: scroll; -webkit-overflow-scrolling: touch;}
    #nav.open {transform: translate(0);}
    #nav ul {margin: 0; padding: 1em; list-style-type: none; overflow: auto;}
    #nav ul li {padding: 10px 0; font-size: 14px; border-bottom: 1px solid #CCC;}
    #nav ul li a {display: block; text-decoration: none; color: #000000; text-align: left;}
    .liinner {padding-top: 0; margin-top: 0;}
    .litel {color: #2D2D2D; font-weight: bold; font-size: 16px;}
    
    #bNav {width: 100%; height: 45px; margin: 0; padding: 5px 0 0; position: fixed; bottom: 0; left: 0; z-index: 999; background-color: rgba(0,0,0,0.5);}
    #bNav ul {width: 100%; max-width: 355px; margin: 0 auto; padding: 0; list-style-type: none; overflow: hidden;}
    #bNav ul li {float: left; margin: 0 0 0 10px;}
    
    #bnavCall {width: 88px; height: 40px; float: left;}
    #bnavCall a {width: 88px; height: 36px; line-height: 36px; font-size: 16px; color:#FFFFFF; background: #F28A1B; border-radius: 5px; text-align: center; border: solid 2px #FFFFFF; float: left;}
    #bnavCall a:hover {width: 88px; height: 36px; line-height: 36px; color:#FFFFFF; background: #F28A1B; float: left; text-decoration: none;}
    
    #bnavMb {width: 88px; height: 40px; float: left;}
    #bnavMb a {width: 88px; height: 36px; line-height: 36px; font-size: 16px; color:#FFFFFF; background: #F28A1B; border-radius: 5px; text-align: center; border: solid 2px #FFFFFF; float: left;}
    #bnavMb a:hover {width: 88px; height: 36px; line-height: 36px; color:#FFFFFF; background: #F28A1B; float: left; text-decoration: none;}
    
    #bnavTop {width: 88px; height: 40px; float: left;}
    #bnavTop a {width: 88px; height: 36px; line-height: 36px; font-size: 16px; color:#FFFFFF; background: #F28A1B; border-radius: 5px; text-align: center; border: solid 2px #FFFFFF; float: left;}
    #bnavTop a:hover {width: 88px; height: 36px; line-height: 36px; color:#FFFFFF; background: #F28A1B; float: left; text-decoration: none;}
    
    #bnavBack {width: 40px; height: 40px; float: left;}
    #bnavBack a {width: 40px; height: 36px; line-height: 36px; font-size: 32px; font-weight: bold; color: #405C3C; background: #F3D300; border-radius: 5px; text-align: center; border: solid 2px #FFFFFF; float: left;}
    #bnavBack a:hover {width: 40px; height: 36px; line-height: 36px; color: #405C3C; background: #F3D300; float: left; text-decoration: none;}

    /* contents */
    #topimg {width: 100%; margin: 0; padding: 0; float: left; position: relative;}
    #topimg img {width: 100%; margin: 0; padding: 0; line-height: 0;}
    #topimg p {width: 80%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #FFFFFF; font-weight: bold; font-size: 5vw;
    text-shadow: 
       1px  1px 4px rgba(153, 153, 153, 0.60),
      -1px  1px 4px rgba(153, 153, 153, 0.60),
       1px -1px 4px rgba(153, 153, 153, 0.60),
      -1px -1px 4px rgba(153, 153, 153, 0.60),
       1px  0px 4px rgba(153, 153, 153, 0.60),
       0px  1px 4px rgba(153, 153, 153, 0.60),
      -1px  0px 4px rgba(153, 153, 153, 0.60),
       0px -1px 4px rgba(153, 153, 153, 0.60);
    }
    
     .line {width: 100%; margin: 20px 0 0; padding: 8px 0 8px 8px; box-sizing: border-box; font-size: 14px; color: #FFFFFF; float: left;}
    
    #infowrap {width: 100%; margin: 10px 0; padding: 20px 0; float: left; background: #f2f2ec;}
    #info {width: 96%; max-width: 980px; max-height: 480px; overflow-y: scroll; margin: 0 auto; padding: 0;}
    #infoline {width: 100%; margin: 0; padding: 8px 0 8px 20px; box-sizing: border-box; color: #FFFFFF; float: left;}
    #infospc {width: 100%; max-width: 980px; margin: 0; padding: 10px 20px 28px; box-sizing: border-box; border: solid 1px #1D1D1D; background: #FFFFFF; float: left;}
    #infospc ul {width: 100%; padding: 0; float: left;}
    .newstime {width: 100%; color: #002EE1; font-size: 16px; margin: 0 0 8px; font-weight: bold; float: left;}
    .newstitle {width: 100%; color: #1D1D1D; font-size: 14px; font-weight: bold; float: left;}
    .newstext {width: 100%; margin: 0 0 50px; padding: 8px 0 16px; border-bottom: dotted 1px #8C8C8C; float: left;}
    
    #twoWrap {width: 100%; float: left;}
    #twobox {width: 100%; max-width: 980px; margin: 0 auto;}
    #left {width: 96%; margin: 0 2%; float: left;}
    #right {width: 96%; margin: 0 2%; float: left;}
    /* left*/
    .texttitle {width: 98%; margin: 0 1%; padding: 8px 0 8px 5px; box-sizing: border-box; float: left;font-size: 16px; color: #685D40;}
    .leftimg {width: 98%; margin: 0 1%; float: left;}
    .leftimg img {width: 100%; margin: 0; padding: 0; line-height: 0; float: left;}
    .text01 {width: 96%; margin: 15px 2%; font-size: 14px; float: left;}
    .text02 {width: 96%; margin: 15px 2%; font-size: 18px; float: left;}
    /* right */
    #conpany {width: 100%; margin: 0; padding: 0; float: left;}
    #conpany table {width: 100%; margin: 0; padding: 0; text-align: center; float: left;}
    .conpanytitle {padding: 8px; color: #FFFFFF; font-weight: 500; font-size: 16px;}
    #conpany table th {padding: 8px 0; color: #FFFFFF; font-weight: 500; font-size: 14px; width: 100px;}
    #conpany table td {padding: 8px 0 8px 5px; color: #1D1D1D; font-size: 14px; border: solid 1px #CCCCCC; text-align: left;}
    
    #bcwrap {width: 100%; margin: 10px 0; padding: 0; border: solid 1px #FFFFFF; box-sizing: border-box; float: left;}
    #bctitle {width: 100%; padding: 8px 0; text-align: center; color: #FFFFFF; font-size: 16px; float: left;}
    #bctext {width: 100%; padding: 8px 5px 20px; border: solid 1px #000000; box-sizing: border-box; font-size: 14px; line-height: 22px; float: left;}
    
    /* twocenter*/
    #twocenter {width: 100%; margin: 0; padding: 0; float: left;}
    #acctitle {width: 96%; margin: 0 2%; padding: 8px 0 8px 30px; box-sizing: border-box; float: left; color: #FFFFFF;}
    #map {width: 96%; height: 402px; margin: 0 2% 20px; padding: 0; float: left; border: solid 1px #1D1D1D; box-sizing: border-box;}
    .gmap {width: 100%; height: 400px;}
    
    /* recruit */
    #rectb {width: 100%; margin: 20px auto; padding: 0; border: solid 1px #1D1D1D; float: left;}
    .rectitle {height: 38px; line-height: 38px; font-size: 18px; text-align: center; color: #FFFFFF;}
    #rectb th {width: 25%; padding: 8px; font-size: 14px; font-weight: 500; color: #FFFFFF;}
    #rectb td {width: 75%; padding: 8px; font-size: 14px; box-sizing: border-box; border:  solid 1px #9B9B9B;}
    
     /*footer*/
    footer {width: 100%; margin: auto 0 0; padding: 0; background: #f2f2ec; float: left;}
    #ftop {width: 100%; margin: 0; padding: 8px 0; text-align: center; font-size: 14px; color: #FFFFFF;}
    #fwrap {width: 100%; max-width: 980px; margin: 0 auto; padding: 15px 0;}
    
    #sitemap {width: 96%; margin: 0 2%; float: left; border: solid 1px #1D1D1D; box-sizing: border-box; border-radius: 5px;}
    #sitemap ul {width: 96%; margin: 10px 2%; padding: 0 0 20px; float: left;}
    #sitemap ul li {width: 96%; margin: 8px 2%; padding: 0 5px; box-sizing: border-box; border-bottom: dotted 1px #1D1D1D;}
    #sitemap ul li a {width: 100%; font-size: 14px; color: #000000;}
    #smtitle {width: 100%; padding: 8px 0; font-size: 14px; color: #FFFFFF;}
    
    #fcopany {width: 96%; margin: 0 2%; float: left;}
    #fcopany ul {width: 96%; margin: 10px 2% 0; padding: 0; float: left;}
    #fctitle {text-align: center; color: #9F802F; font-size: 12px; font-weight: bold;}
    #fcname {text-align: center; font-size: 22px; line-height: 26px; padding: 8px 0 3px;}
    #fcsubname {text-align: center; font-size: 16px;}
    #fcadd {text-align: center; font-size: 16px;}
    #fccall {text-align: center; font-size: 16px;}
    #fcmail {text-align: center; font-size: 16px;}
    #fcurl {text-align: center; font-size: 16px;}
    
    #copyright {width: 100%; margin: 20px 0 0; padding: 15px 0 80px; text-align: center; font-size: 10px; line-height: 14px; float: left; color: #FFFFFF;}
    
    .up {display: none !important;}
    
}