@charset "utf-8";
body {
	margin:0;
	padding:0;
	font-family: "Poppins", "ＭＳ Ｐゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
	font-size:14px;
	color:#1c1c1c;
	background: linear-gradient(
    to bottom,
    #000 0,
    #000 180px,
    #fff 180px,
    #fff 100%);
	
    letter-spacing: 0.05em;
}
.stxt {
    font-size: 0.8em;
    line-height: 180%;
}

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

.clearfix::after {
   content: "";
   display: block;
   clear: both;
}

a:link {
    color:#333333;
}

a:visited {
    color:#333333;
}

a:arrival {
    color:#666;
}
a:hover {
    color:#666;
    text-decoration: none;
}

a img {
border: none;
}

#philosophy,#feature,#forcompanies,#contact,#data,#access{
    display: block;
    padding-top: 20px;
    margin-top: -20px;
}

.smp_only {
    display: none;
}

#container {
    width:90%;
    margin:auto auto 10% auto;
    max-width:1200px;
}

#header {
    width:100%;
    margin:auto;
    padding-top:30px;
}


/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="reset"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="reset"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="reset"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}


/*--------------------
ナビ
--------------------*/

#catch {
    width:100%;
    margin:auto auto 2% auto;
    font-size:0.7em;
    background:#000000;
    line-height: 400%;
    letter-spacing: 0.1em;
}

.catch {
    width:90%;
    width:1200px;
    margin:auto;
}
.nav {
    width:90%;
    max-width:1200px;
    margin:2% auto 0 auto;
}

.smp_menu {
    display: none;
}


.pc_menu  {
    width:100%;
}

.pc_menu .logo {
	width: 10%;
    float: left;
}

.pc_menu .logo img {
	width:100%;
    margin:auto ;
}

.pc_navi {
	background-color: #000000;
	display: block;
	margin:  2% auto auto auto;
	overflow: hidden;
	width: 90%;
    float: right;
    font-weight:600;
}

.pc_navi ul {
	margin: 0;
	padding: 0;
    font-size:0;
     text-align: right;
}

.pc_navi ul li {
    text-align: center;
  display: inline-block;
	list-style-type: none;
	-webkit-transition: all 0.2s;
	        transition: all 0.2s;
	font-size:13px;
}

.pc_navi ul li:last-child {
    border-right: none;
}

.pc_navi > ul > li > a > .caret {
	border-top: 4px solid #aaaaaa;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
	content: '';
	display: inline-block;
	height: 0;
	width: 0;
	vertical-align: middle;
	-webkit-transition: color 0.1s linear;
	        transition: color 0.1s linear;
}
.pc_navi > ul > li > a {
	color: #ffffff;
	display: block;
	line-height: 56px;
	padding: 0 25px;
	text-decoration: none;
}
.pc_navi > ul > li:hover {
	background-color: #000000;
}
.pc_navi > ul > li:hover > a {
	color: rgb( 255, 255, 255 );
}
.pc_navi > ul > li:hover > a > .caret {
	border-top-color: rgb( 255, 255, 255 );
}
.pc_navi > ul > li > div {
	background-color: #272626;
	border-top: 0;
	border-radius: 0 0 4px 4px;
	box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
	display: none;
	margin: 0;
	opacity: 0;
	position: absolute;
	visibility: hidden;
	-webkit-transiton: opacity 0.2s;
	       transition: opacity 0.2s;
    z-index: 999999999;
    font-weight:300;
}
.pc_navi > ul > li:hover > div {
	display: block;
	opacity: 1;
	visibility: visible;
}
.pc_navi > ul > li > div ul > li {
	display: block;
    border:none;
	font-size:12px;
}
.pc_navi > ul > li > div ul > li > a {
	color: #ffffff;
	display: block;
	/*padding: 12px 24px;*/
    padding:10px 20px;
	text-decoration: none;
    text-align: left;
    border:none;
}
.pc_navi > ul > li > div ul > li:hover > a {
	/*background-color: rgba( 255, 255, 255, 0.1);*/
    background-color: #00745e;
}

.pc_navi .login {
    background-color: #00745e;
}



/*--------------------
全体
--------------------*/



#main {
    width:100%;
    margin:auto;
    max-width:1200px;
	position: relative; /* 親要素を基準に配置 */
}

.box {
    width:100%;
    margin:0 auto 50px auto;
    text-align: left;
    line-height: 180%;
	position: relative; /* .btn の absolute 配置の基準 */
}


.box img {
    width:100%;
}

.box2 {
    width:50%;
    margin:20px auto;
    float: left;
}

.box2 img {
    width:96%;
}



h3 {
    margin: 2.5em 0 0.8em 0;
    padding: 0 0 0.8em 0;
    font-size:2em;
    /*border-bottom:2px solid #000;*/
    border-bottom: solid 3px #f8bc00;
  position: relative;
    text-align: left;
    color:#005a49;
	font-weight: 600;
}

h3 p {
    font-size:0.5em;
}

h3:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #005a49;
  bottom: -3px;
  width: 50%;
}

/*--------------------
TOPページ
--------------------*/

/*キャッチコピー*/
.catchcopy {
    text-align: left;
    width:100%;
	font-size:32px;
	font-weight:600;
	line-height: 0.6em;
	letter-spacing: 0.1em;
}

.line {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeInUp 1s ease-out forwards;
}

.line.delay {
  animation-delay: 0.6s;
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/*募集ボタン*/
.btn {
    text-align: right; /* 右寄せ */
	position: absolute;
    bottom: -30px; /* 画像の下にはみ出すように */
    right: 20px; /* 右側に配置 */
}

a.btn--circle {
    border-radius: 50%;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 220px;
    height: 220px;
    color: #000000;
    text-decoration: none;
    font-weight: bold;
    text-align: center;
    line-height: 1.3;
	background: rgba(255, 222, 5, 0.8); /* 透明度を追加 */
    transition: transform 0.3s ease-in-out; /* スムーズな動き */
}

.btn--circle:hover {
    transform: scale(1.1); /* 1.1倍に拡大 */
}

.btn--circle span {
    display: block;
}

.btn--circle .large {
    font-size: 52px; /* 2行目だけ大きく */
    font-weight: 700;
}

.btn--circle .small {
    font-size: 23px;
}


/*ニュース*/

.news {
    margin:0;
    text-align: left;
    width:100%;
}


.news h2 {
    margin:0 0 1em 0;
    padding:0;
    font-size:1.5em;
    color:#f1c243;
    font-weight:500;
	letter-spacing: 0.2rem;
}


dl.newslist {
    padding:0;
    line-height:1.8;
    width:100%;
}
dl.newslist dt {
    width:6em;
    float:left;
    margin:0;
    padding:0 0 0 5px;
}
dl.newslist dd {
    margin:0 0 10px;
    padding:0 5px 10px 8em;
    border-bottom:1px dotted #ccc;
}

/*今後のスケジュール
--------------------*/
.schedule {
	margin:0;
	text-align: left;
    width:100%;
}

.schedule h2 {
    padding:0;
    font-size:1.5em;
    color:#f1c243;
    font-weight:500;
	letter-spacing: 0.2rem;
}


.schedule table {
    border-collapse: collapse;  /* セルの線を重ねる */
    width:100%;
}
 
.schedule th,td {
    padding:3%;          /* 余白指定 */
}
 
.schedule th {
    background-color: #2A2A2A;  /* 背景色指定 */
    color:  #fff;               /* 文字色指定 */
    font-weight:  normal;       /* 文字の太さ指定 */
    position:  relative;        /* 位置指定 */
    z-index: 10;    /* 重なり調整 */
    width:20%;
    text-align: center;
    border-bottom:  solid #000000;
}

.schedule td {
    padding-left: 5%;      /* 余白指定 */
}

 
.schedule tr {
    border-bottom:  solid #2A2A2A; /* 線指定 */
    width:80%;
    line-height: 200%;
}

.schedule tr:last-child {
    border-bottom:  none; /* 線指定 */
}



/*アポロでのお仕事*/

.top_cate h2 {
    padding-top:0;
    padding-bottom:0.5em;
    margin:0;
    font-size:2em;
    line-height: 180%;
}

.top_cate img {
    margin:5% 5% 0 5% ;
    width:90%;
}


/*社員募集バナー*/

.recruit_bnr {
    margin-top:50px;
}


/*バイト募集バナー*/

.employ_bnr {
    margin-top:100px;
}
.employ_bnr img {
    border-radius: 10px;
}


/*--------------------
各ページ
--------------------*/

.breadcrumbs {
    margin-top:20px;
    font-size:10px;
	color: #ffffff;
}

.breadcrumbs a {
    color:#ffffff;
}

.intop {
    width:100%;
    padding-top:90px;
}


.intop img {
    width:100%;
    border-radius: 10px;
}

/*アポロブラザーズとは_リンク
--------------------*/
.about_link {
    width:100%;
    margin-top:50px;
    font-size:18px;
    line-height: 300%;
    font-weight:600;
}

.about_link a:link {
    color:#005a49;
}

.about_link a:active {
    color:#005a49;
}
.about_link a:visited {
    color: #00745e;
}
.about_link a:hover {
    color: #00745e;
}

/*1日の仕事の流れ
--------------------*/

.oneday {
    width:100%;
}

.oneday img {
    width:100%;
    border-radius: 20px;
    margin:2% 0;
}

.oneday_r {
    width:47%;
    margin:3% 0 3% 3%;
    float:left;
}
.oneday_l {
    width:47%;
    margin:3% 3% 3% 0;
    float:left;
}

.oneday_time {
    color:#f8bc00;
    font-size:1.5em;
    margin-right:1em;
    font-family: 'PT Sans Narrow', sans-serif;
}
.oneday_content {
    font-size:1.5em;
}
.oneday p {
    margin-top:10%;
}


/*仕事のカテゴリー
--------------------*/
.category {
    
}

.category p {
    margin:2% auto 8% auto;
}

/*特徴
--------------------*/
.bus_catch {
    font-size:2em;
    line-height: 180%;
}
.bus_region_title {
    font-size:2em;
    font-weight:600;
    text-align: center;
    margin:5% auto 2% auto;
}

.bus_region {
    width:31.33333333%;
    margin:1%;
    background:#f8bc00;
    color:#FFF;
    border-radius: 50%;
    padding:5% 5%;
    float:left;
}

.bus_region p {
    height:80px;
    margin:0 ;
    padding:0 ;
    text-align: center;
}
.bus_region h4 {
    font-size:2em;
    font-weight:600;
    margin:0 ;
    padding:0 ;
    text-align:center;
    letter-spacing:0.1em;
}


/*企業の皆さまへ
--------------------*/
.forcompanies {
    
}

.forcompanies ul {  
    margin:2em 0;
    padding:0;
}

.forcompanies li {
    list-style:none;
    margin:0 0 1em 0;
    padding:0;
    font-weight:600;
    font-size:1.2em;
}


/*お問い合わせフォーム
--------------------*/
.formTable {
    width:100%;
}

table.formTable{
	width:100%;
	margin:3% auto;
	border-collapse:collapse;
}

table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:1em;
}

table.formTable th {
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
	vertical-align:top;
}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"],
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: border-color 0.2s ease-in-out;
		-webkit-transition: border-color 0.2s ease-in-out;
		-ms-transition: border-color 0.2s ease-in-out;
		transition: border-color 0.2s ease-in-out;
		background: #fff;
		border: solid 1px #e0e0e0;
		border-radius: 5px;
		color: inherit;
		outline: 0;
		padding: 0.75em;
		text-decoration: none;
    text-align: left;
        margin:1% 0;
	}

		input[type="text"]:focus,
		input[type="password"]:focus,
		input[type="email"]:focus,
		input[type="tel"]:focus,
		textarea:focus {
			border-color: #F8BC00;
		}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"] {	
		line-height: 2em;
        width:50%;
	}
textarea {
        width:100%;
	}



.contact_bt {
    display:inline-block;
    margin:1% 1% 5% 1%;
     width: 150px;
     line-height: 300%;
     color: #FFF;
     text-decoration: none;
     text-align: center;
     background-color: #f8bc00; /*ボタン色*/
     border-radius: 5px; /*角丸*/
     -webkit-transition: all 0.5s;
     transition: all 0.5s;
    font-size:1.2em;
    letter-spacing:0.2em;
}
.contact_bt:hover{
     background-color: #f8e500; /*ボタン色*/
}


/*問い合わせ
確認＆送信ページ
--------------------*/
.contact_send {
    width:100%;
}

.contact_send h4 {
    font-size:2em;
    text-align: center;
}

.contact_send .send_logo{
    width:200px;
    margin:5% auto;
    text-align: center;
}

.contact_send .send_logo img{
    width:100%;
}

.contact_send .contact_send_txt {
    width:100%;
    text-align: center;
    margin:5% auto;  
}

.error_messe{
	color:#FF5C26;
}

/*会社概要_会社概要*/

.officeinfo {
    width:100%;
}

table.officeinfo{
	width:100%;
	margin:3% auto;
	border-collapse:collapse;
}

table.officeinfo td,table.officeinfo th{
	border:1px solid #ccc;
	padding:1em;
}

table.officeinfo th {
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
	vertical-align:top;
}

/*会社概要_アクセス*/

.access ul {
    margin:2% 0;
    padding:0;
    
}
.access li {
    margin:0 0 2em 0;
    padding:0;
    list-style: none;
}

.map {
    
}

.map img{
    width:100%; 
    margin-bottom:5%;
}

/* Google MAP */

.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/*バイト募集*/

.employ {
    width:100%;
}

table.employ{
	width:100%;
	margin:3% auto;
	border-collapse:collapse;
}

table.employ td,table.employ th{
	border:1px solid #ccc;
	padding:1em;
}

table.employ th {
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
	vertical-align:top;
}

table.employ td {
	width:70%;
}

/**/
.recuruit_txt {
    width:100%;
    margin-top:5%;
    text-align: center;
    font-size: 1.2em;
    line-height: 200%;
}

/*--------------------
footer
--------------------*/
#footer {
    width:100%;
    background: #EEEEEE;
    color:#666;
    text-align: center;
    padding-top:3%;
    padding-bottom:3%;
    font-size:0.8em;
    line-height: 200%;
}

.footer_box {
    max-width:1200px;
    overflow: hidden;
    width:90%;
    margin:auto;
}

.footer_info {
    width:40%;
    float: left;
    text-align: left;
}

.footer_sitemap {
    width:60%;
    float: left;
    text-align: left;
    overflow: hidden;
}

.footer_sitemap p {
    display: block;
    font-weight: 900;
    font-size:1.2em;
    padding-bottom:10px;
    border-bottom:1px solid #333;
    margin-bottom:10px;
}

.footer_sitemap_l {
    width:33%;
    float:left;
}

.footer_sitemap_c {
    width:33%;
    float:left;
}

.fotter_sitemap_r{
    width:33%;
    float:left;
}

ul.sitemap {
	text-align:left;
    margin:0;
    padding:0;
}
ul.sitemap li {
	list-style:none;
	font-weight:600;
	margin-top:10px;
    font-size:12px;
}
ul.sitemap li ul {
	padding-left:15px;
    margin-top:5px;
}
ul.sitemap li ul li {
	list-style:none;
	font-size:0.8em;
	font-weight:300;
	margin:2px 0 0 0;
}

.footer_sitemap a:link {
    color:#333;
    text-decoration: underline;
}

.footer_sitemap a:active {
    color:#333;
    text-decoration: underline;
}

.footer_sitemap a:visited {
    color:#333;
    text-decoration: underline;
}

.footer_sitemap a:hover {
    color:#333;
    text-decoration: underline;
}
.footer_info img {
    width:100px;
    height:auto;
    margin: 10px auto;;
}
.coryright {
    font-size:0.8em;
    margin-top:2em;
    color:#999;
}

@media screen and (max-width: 1200px) { 
    
body {
        font-size: 12px;
    border-top: 3px solid #00745e;
	background: linear-gradient(
      to bottom,
      #000 0,
      #000 100px,
      #fff 100px,
      #fff 100%);
    }    
	
.smp_br {
    display: block;
}
    
.smp_only {
    display: block;
}
.pc_only {
    display: none;
}
    

.breadcrumbs {
    margin-top:40px;
    font-size:10px;
}

/*メニュー*/

#header {
    padding-top:5%;
}

#header .logo {
    width:100%;
    margin:0 auto 5% auto;
    font-size:0.8em;
    text-align: center;
    font-weight: 600;
} 
    
#header .logo img {
    width:30%;
    margin: auto auto 2% auto;
} 
  
.pc_menu {
        display: none;
    }  
    
.smp_menu {
     display: block;
    margin-top:-3px;
    }

    
.smp_menu .logo{
    width:100%;
    margin:10px auto;
    text-align: center;
    }
    
.smp_menu .logo img{
    width:40%;
    margin:auto;
    }    
        
    
.smp_menu ul {
  margin: 0;
  padding:0 ;
}
 
.smp_menu li {
  list-style: none;
    padding:8% 5%;
    border-bottom: 1px solid #FFF;
    font-weight:600;
}
 
    
.smp_menu ul li ul {
  margin: 0;
  padding:3% 0 0 0;
    font-size:0.8em;
}
    
.smp_menu ul li ul li {
  list-style: none;
    padding:2% 5% ;
    border-bottom: none;
    font-weight:300;
}
 
    
.smp_menu a {
  text-decoration: none;
  color: #fff;
}

.smp_menu #menu {
  position: fixed;
  top: 0;
  left: -340px; /* メニューのwidth + padding */
  width: 300px; /* メニューのwidth */
  height: 100%;
  padding: 20px;
  transition: right .5s, left .5s; /* アニメーション */
  /*background-color: rgba(255, 255, 255, .8);*/
   background-color: rgba(0, 116, 94, .9);
z-index: 9999999999;
}
 
.smp_menu .toggle {
  font-size: 40px;
  cursor: pointer;
   padding:5px 15px;
  position: fixed;
z-index: 9999999999;
    right:0;
  /*background-color: rgba(255, 255, 255, .8);*/
    background-color: rgba(0, 116, 94, .9);
  /*color: rgba(0, 116, 94, 1);*/
    color:#FFF;
    border-bottom-left-radius: 20px;
}
 
.smp_menu toggle:hover {
  text-decoration: underline;
}
 
.smp_menu #open {
  display: none;
}
 
/* :checked 擬似クラスを使って、#openがチェック状態になった時に、#menuが「right: 0;」になります。 */
.smp_menu #open:checked + #menu {
  left: 0;
}
    
/*基本*/
    

.box {
    margin:0 auto;
}

    
h3 {
    font-size:1.5em;
    margin: 0 0 0.8em 0;
    padding-top:3em;
}    
 

/*社員募集バナー*/

.recruit_bnr {
    margin-top:50px;
}
    
.employ_bnr {
        margin-top:50px;
    }
    
/*1日のお仕事の流れ
--------------------*/   
.oneday_r {
    width:100%;
    margin:0 0 3em 0;
    float:both;
}
.oneday_l {
    width:100%;
    margin:0 0 3em 0;
    float:both;
}
    
/*企業の皆様へ_特徴
--------------------*/
.bus_region_title {
    font-size:1.5em;
    margin:5% auto 2% auto;
}
    
.bus_region {
    width:100%;
    border-radius: 10px;
    padding:5%;
}

.bus_region p {
    height:auto;
}
.bus_region h4 {
    font-size:1.5em;
    margin-top:0.5em;
}    

  
/*新規スタッフ募集
--------------------*/ 
.recuruit_txt {
    text-align: left;
}    
    
    
input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"] {	
		line-height: 2em;
        width:100%;
	}
    
/*フッター
--------------------*/ 
.footer_info    {
    width:100%;
    float:both;
} 
.footer_sitemap{
    width:100%;
    float:both;
    margin-top:30px;
} 
    
.footer_sitemap_l {
    width:100%;
    float:both;
}

.footer_sitemap_c {
    width:100%;
    float:both;
}

.fotter_sitemap_r{
    width:100%;
    float:both;
    margin-bottom:30px;
}
    
}


/* スマホ */
@media screen and (max-width:599px){
body {
	background: linear-gradient(to bottom, #000 0%, #000 100px, #fff 100px, #fff 100%);
}
}