@charset "utf-8";

/* -----------------------------------------------------------
　common
----------------------------------------------------------- */

* {box-sizing:border-box;}
img {max-width:100%;}
.fcred {color:#FF0000;}
.fwbold {font-weight:bold;}
.left {float:left;}
.right {float:right;}
.center {text-align:center;}
.clear {clear: both;}
.italic {font-style:italic;}
input,textarea {font-family:inherit;}

a {
  color:inherit;
  text-decoration:none;
}
html {font-size:62.5%;}
body {
  font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:1.3rem;
  line-height:1.45;
  color:#655D5B;
  background:url(../img/common/bg.gif);
} 

@media screen and (min-width: 768px){ 
  .sp_cont {display:none;} 
  a:hover {
    text-decoration:underline;
    color:inherit;
  }
  .hover_btn {transition:0.5s;opacity:1;}
  .hover_btn:hover {transition:0.5s;opacity:0.75;}
}
@media screen and (max-width: 767px){
  html,body {height:100%;}
  body {
    -webkit-text-size-adjust: 100%;
    font-size:12px;
    line-height:1.5;
  }
  .pc_cont {display:none;}  
}

/* -----------------------------------------------------------
  template
----------------------------------------------------------- */
 
/* :::::::::: header :::::::::: */
  
header {
  position:fixed;
  width:100%;
  height:60px;
  padding:5px 10px;
  background:#FFFFFF;
  box-shadow:0 0 5px 1px rgba(101,93,91,0.3);
  top:0;
  left:0;
  z-index:10;
}
header .logo {
  width:200px;
  height:50px;
  float:left;
}
header .logo img {
  width:auto;
  height:100%;
}
header .btn_logout {
  position:absolute;
  height:16px;
  color:#F59601;
  padding:0 0 0 1.5em;
  background:url(../img/common/btn_logout.png) no-repeat left center;
  cursor:pointer;
  margin:auto;
  top:0;
  bottom:0;
  right:20px;
}

/* :::::::::: main :::::::::: */
  
main {
  display:block;
  width:100%;
  max-width:1040px;
  margin:0 auto;
  padding:90px 20px 0;
}
main article {width:100%;}
main article h2 {
  font-size:1.8rem;
  margin:0 auto 30px;
  text-align:center;
  clear:both;
}
main article h2 span {
  position:relative;
  display:inline-block;
  width:auto;
  min-width:330px;
  text-align:center;
  padding:0 1em 0.5em;
  border-bottom:solid 2px #D8D6D5;
  z-index:0;
}
main article h2 span::before {
  position:absolute;
  display:block;
  content:"";
  width:30px;
  height:4px;
  background:#F59601;
  margin:auto;
  bottom:-3px;
  left:0;
  right:0;
  z-index:1;
}

/* :::::::::: aside :::::::::: */

aside {
  position:fixed;
  width:100%;
  height:100vh;
  top:0;
  left:0;
  opacity:0;
  visibility:hidden;
  transition:0.5s;
  z-index:100;
}
aside.active {
  opacity:1;
  visibility:visible;
}
aside .bg_modal {z-index:1;}
aside .aside_box {
  position:absolute;
  width:650px;
  height:300px;
  background:#FFFFFF;
  border-radius:6px;
  margin:auto;
  top:0;
  bottom:0;
  left:0;
  right:0;
  opacity:0;
  visibility:hidden;
  transition:0.5s;
  z-index:10;
}
aside .aside_box.subject {height:400px;}
aside .aside_box.furikaeri {
  width:92%;
  max-width:1000px;
  height:600px;
}
aside .aside_box.active {
  opacity:1;
  visibility:visible;
}
aside .aside_box h2 {
  width:100%;
  height:40px;
  line-height:40px;
  color:#FFFFFF;
  font-size:1.8rem;
  padding:0 40px 0 1em;
  border-radius:6px 6px 0 0;
  background:url(../img/common/bg_aside.gif);
}
aside .aside_box .button_close {
  position:absolute;
  top:7px;
  right:10px;
  cursor:pointer;
}
aside .aside_box > div {
  width:100%;
  height:240px;
  text-align:center;
  padding:40px 30px;
  border-radius:0 0 6px 6px;
}
aside .aside_box.subject > div {
  height:340px;
  padding:40px 50px;
}
aside .aside_box.furikaeri > div {
  height:560px;
  padding:30px;
}
aside .aside_box > div h3 {
  position:relative;
  display:inline-block;
  width:auto;
  font-size:1.8rem;
  padding:0 1em 0.5em;
  margin:0 0 1em;
  border-bottom:solid 2px #D8D6D5;
  clear:both;
  z-index:0;
}
aside .aside_box > div h3::before {
  position:absolute;
  display:block;
  content:"";
  width:30px;
  height:4px;
  background:#F59601;
  margin:auto;
  bottom:-3px;
  left:0;
  right:0;
  z-index:1;
}
aside .aside_box > div h3 span {
  display:block;
  font-weight:normal;
  font-size:1.3rem;
  margin:0 0 0.5em;
}
aside .aside_box > div p {
  font-size:1.2rem;
  line-height:2;
  text-align:left;
}
aside .aside_box > div ul li {
  display:inline-block;
  width:180px;
  height:40px;
  margin:30px 5px 0;
}
aside .aside_box > div ul li button {
  width:100%;
  height:100%;
  font-weight:bold;
  padding:0;
  background:#F59601;
}
aside .aside_box > div ul li button.button_cancel {background:#D8D6D5;}
aside .aside_box.furikaeri > div {position:relative;}
aside .aside_box.furikaeri > div ul.tab_list {
  width:100%;
  margin:0 auto 5px;
  text-align:left;
  overflow:hidden;
}
aside .aside_box.furikaeri > div ul.tab_list li {
  position:relative;
  display:inline-block;
  width:auto;
  min-width:180px;
  height:36px;
  line-height:36px;
  font-size:1.5rem;
  font-weight:bold;
  color:#FFFFFF;
  margin:0 10px 10px 0;
  padding:0 2em;
  text-align:center;
  border-radius:18px;
  background:#D8D6D5;
  box-shadow:0 0 5px 1px rgba(101,93,91,0.3);
  z-index:0;
  cursor:pointer;
}
aside .aside_box.furikaeri > div ul.tab_list li::after {
  position:absolute;
  display:block;
  content:"";
  width:0;
  height:0;
  border-top:solid 0.7em #D8D6D5;
  border-left:solid 0.5em transparent;
  border-right:solid 0.5em transparent;
  margin:auto;
  top:100%;
  left:0;
  right:0;
  z-index:0;
}
aside .aside_box.furikaeri > div ul.tab_list li.active {background:#F59601;}
aside .aside_box.furikaeri > div ul.tab_list li.active::after {border-top:solid 0.7em #F59601;}
aside .aside_box.furikaeri > div .tab_contents {
  display:none;
  width:100%;
  height:450px;
  overflow-y:scroll;
  -webkit-overflow-scrolling:touch;
  /*-ms-overflow-style:none;
  scrollbar-width:none;*/  
}

/*aside .aside_box.furikaeri > div .tab_contents::-webkit-scrollbar {display:none;}*/
aside .aside_box.furikaeri > div .tab_contents.active {display:block;}
aside .aside_box.furikaeri > div .tab_contents table {margin:0 auto 30px;}

aside .aside_box.furikaeri > div .tab_contents table img {display:block;}
aside .aside_box.furikaeri > div .tab_contents table tr th {
  position:-webkit-sticky;
  position:sticky;
  top:0;
  z-index:10;
}

aside .aside_box.furikaeri > div .tab_contents table td {position:relative;}
aside .aside_box.furikaeri > div .tab_contents table td a {
  /*background:rgba(0,0,0,0.2);*/
  position:absolute;
  display:block;
}
  
/* :::::::::: footer :::::::::: */
  
footer {
  position:fixed;
  width:100%;
  height:100px;
  padding:20px;
  background:#FFFFFF;
  box-shadow:0 0 5px 1px rgba(101,93,91,0.3);
  bottom:0;
  left:0;
  z-index:0;
}
footer .pagetop {
  position:fixed;
  bottom:20px;
  right:20px;
  z-index:120;
  cursor:pointer;
}
footer .pagetop img {display:block;}
footer .f_logo {
  width:155px;
  height:60px;
  padding:5px 0;
  float:left;
}
footer > div {
  position:absolute;
  display:inline-block;
  height:16px;
  margin:auto;
  top:0;
  bottom:0;
  right:100px;
  z-index:1;
}
footer > div p {display:inline-block;}
footer > div p.f_link {margin:0 2em 0 0;}
footer > div p.f_link a {
  position:relative;
  display:inline-block;
  padding:0 0 0 1.5em;
  margin:0 0 0 2em;
}
footer > div p.f_link a::before {
  position:absolute;
  display:block;
  content:"";
  width:0.5em;
  height:0.5em;
  border-top:solid 2px #EB6100;
  border-right:solid 2px #EB6100;
  transform:rotate(45deg);
  top:0.25em;
  left:0;
}
footer > div p.copyright {font-size:1.3rem;}

.loading {
  position:fixed;
  width:100vw;
  height:100vh;
  margin:auto;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background:rgba(62,58,57,0.85);
  z-index:120;
  opacity:0;
  visibility:hidden;
  transition:0.5s;
}
.loading.active {
  opacity:1;
  visibility:visible;
}
.loading img {
  position:absolute;
  width:180px;
  height:180px;
  margin:auto;
  top:0;
  bottom:0;
  left:0;
  right:0;
}
.scroll_nav {display:none;}
.scroll_nav.active {display:none;}


@media screen and (max-width: 767px){ 
  
  /* :::::::::: header :::::::::: */
  
  header {
    height:60px;
    padding:12px 2%;
  }
  header .logo {
    width:175px;
    height:36px;
  }
  header .btn_logout {
    height:30px;
    font-size:1rem;
    padding:20px 0 0;
    background:url(../img/common/btn_logout.png) no-repeat top center / auto 1.6rem;;
    margin:auto;
    right:4%;
  }
  
  /* :::::::::: main :::::::::: */
  
  main {
    height:100%;
    padding:80px 4% 0;
  } 
  main article {height:calc(100% - 120px);}
  main article h2 {
    font-size:1.6rem;
    margin:0 auto 0.75em;
  }
  main article h2 span {padding:0 0.25em 0.25em;}
  
  /* :::::::::: aside :::::::::: */

  aside .aside_box {
    width:92%;
    max-width:350px;
    height:390px;
  }
  aside .aside_box.subject {height:360px;}
  aside .aside_box.furikaeri {height:70%;}
  aside .aside_box h2 {
    height:auto;
    line-height:1.3;
    font-size:1.6rem;
    padding:3% 40px 3% 3%
  }
  aside .aside_box .button_close {
    width:20px;
    top:8px;
  }
  aside .aside_box > div {
    height:354px;
    padding:30px 5px;
  } 
  aside .aside_box.subject > div {
    height:304px;
    padding:30px 5px;
  }
  aside .aside_box.furikaer {height:80%;}
  aside .aside_box.furikaeri > div {
    width:92%;
    height:calc(100% - 90px);
    padding:0;
    margin:4% auto;
    overflow-x:scroll;
    -webkit-overflow-scrolling:touch;
    border-radius:0;
  }
  aside .aside_box > div h3 {
    font-size:1.6rem;
    padding:0 0.25em 0.25em;
    margin:0 auto 0.75em;
  }
  aside .aside_box > div h3 span {font-size:1.1rem;}
  aside .aside_box > div p {
    font-size:1.1rem;
    text-align:center;
  }
  aside .aside_box > div ul li {
    width:175px;
    height:36px;
    margin:15px auto 0;
  }
  aside .aside_box.subject  > div ul li {
    width:48%;
    height:36px;
    margin:15px auto 0;
  }
  aside .aside_box.furikaeri > div ul.tab_list {
    width:200%;
    margin:0 auto 3%;
  }
  aside .aside_box.furikaeri > div ul.tab_list li {font-size:1.3rem;}
  aside .aside_box.furikaeri > div .tab_contents {
    display:none;
    width:200%;
    height:100%;
  }
  
  /* :::::::::: footer :::::::::: */
  
  footer {
    height:auto;
    padding:12px 2%;
    overflow:hidden;
  }
  footer .pagetop {
    width:5em;
    height:5em;
    bottom:3%;
    right:3%;
  }
  footer .f_logo {
    width:80px;
    height:25px;
    padding:0;
  }
  footer > div {
    position:static;
    width:calc(100vw - 80px - 8%);
    height:auto;
    text-align:right;
    float:right;
    margin:0 2% 0 0;
  }
  footer > div p {display:block;}
  footer > div p.f_link {margin:0;}
  footer > div p.copyright {font-size:1rem;}
  
  .loading img {
    width:40vw;
    height:40vw;
  }
  .scroll_nav  {
    position:fixed;
    display:block;
    width:30%;
    margin:auto;
    top:50%;
    left:0;
    right:0;
    opacity:0;
    z-index:110;
    visibility:hidden;
    transition:0.5s;
  }
  .scroll_nav.active {
    display:block;
    opacity:1;
    visibility:visible;
  }   

}

.bg_modal {
  position:fixed;
  width:100vw;
  height:100%;
  background:rgba(62,58,57,0.85);
  top:0;
  left:0;
  right:0;
  bottom:0;
  z-index:100;
  opacity:0;
  transition:0.5s;
  visibility:hidden;
  cursor:pointer;
}
.bg_modal.active  {
  opacity:1;
  visibility:visible;
}

/* -----------------------------------------------------------
 search
----------------------------------------------------------- */

.search_area {
  position:relative;
  width:100%;
  max-width:1000px;
  height:40px;
  margin:0 auto 20px;
}
.select_box {
  display:inline-block;
  margin:0 0 20px;
  float:left;
}
.search_area ul {
  position:absolute;
  display:inline-block;
  top:0;
  right:0;
}
.search_area ul li {
  display:inline-block;
  width:180px;
  height:40px;
  line-height:40px;
  font-weight:bold;
  color:#FFFFFF;
  margin:0 0 0 5px;
  /*padding:0 0 0 4em;*/
  text-align:center;
  border-radius:20px;
  box-shadow:0 0 2px 1px rgba(101,93,91,0.3);
  vertical-align:middle;
  cursor:pointer;
  opacity:1;
  transition:0.5s;
}
.search_area ul li:hover {opacity:0.6;}
.search_area ul li.btn_point {
  padding:0;
  /*background:url(../img/common/bg_btn.png) no-repeat center right 10px,#87C022;*/
  background:#87C022;
}
.search_area ul li.btn_back {
  /*background:url(../img/common/bg_btn.png) no-repeat center right 10px,#EB6100;*/
  background:#EB6100;
}
.search_area ul li.btn_point a {
  display:block;
  width:100%;
  height:100%;
  text-align:center;
  /*padding:0 0 0 4em;*/
  padding:0;
  text-decoration:none;
}
.search_area ul li.btn_print a {padding:0 2.25em;}
.search_area ul li.btn_point a > span {display:table;}
.search_area ul li.btn_point a > span > span {
  display:table-cell;
  font-size:1rem;
  line-height:1rem;
  text-align:center;
  vertical-align:middle;
}
.search_area ul li.btn_print a {padding:0 0 0 15%;}
button {
  display:inline-block;
  width:auto;
  height:40px;
  line-height:40px;
  padding:0 2.5em;
  color:#FFFFFF;
  border-radius:20px;
  text-align:center;
  background:#EB6100;
  box-shadow:0 0 2px 1px rgba(101,93,91,0.3);
  cursor:pointer;
}
.select_box .select_outer {
  position:relative;
  display:inline-block;
  margin:0 15px 0 0;
  text-align:center;
}
.select_box .select_outer::before {
  position:absolute;
  display:block;
  content:"";
  width:0.5em;
  height:0.5em;
  border-bottom:solid 2px #EB6100;
  border-right:solid 2px #EB6100;
  transform:rotate(45deg);
  top:0.75em;
  right:0.75em;
  pointer-events:none;
}
.select_box .select_outer select {
  width:160px;
  height:40px;
  line-height:40px;
  font-weight:bold;
  text-align:center;
  background:#FFFFFF;
  padding:0 2em;
  border-radius:4px;
  box-shadow:0 0 5px 1px rgba(101,93,91,0.3);
}

@media screen and (max-width: 960px){ 
  
  .search_area {
    height:auto;
    margin:0 auto;
  }
  .select_box {
    display:block;
    margin:0 0 3%;
    padding:3px;
    float:none;
    overflow:hidden;
    clear:both;
  }
  .search_area ul {
    position:static;
    display:block;
    overflow:hidden;
    margin:0 auto;
  }
  .search_area ul li {
    display:block;
    width:48%;
    height:36px;
    font-size:1.1rem;
    line-height:36px;
    margin:0 4% 3% 0;
    /*padding:0 0 0 1em;*/
    float:left;
  }
  .search_area ul li:nth-child(even) {margin:0;}
  .search_area ul li.btn_back {font-size:1.0rem;}
  /*.search_area ul li.btn_point a {padding:0 0 0 1em;}*/
  .search_area ul li.btn_point a > span > span {transform:scale(1);font-size:8px;}
  button {
    height:36px;
    line-height:36px;
    font-size:1.3rem;
    padding:0 2em;
    border-radius:18px;
  }
  .select_box .select_outer {
    display:block;
    width:40%;
    margin:0 5% 0 0;
    float:left;
  }
  .select_box .select_outer::before {
    width:0.75em;
    height:0.75em;
    top:1em;
    right:1em;
  }
  .select_box .select_outer select {
    width:100%;
    height:36px;
    line-height:36px;
    font-size:1.4rem;
  }
  .select_box button {
    display:block;
    width:30%;
    float:left;
  }
}

/* -----------------------------------------------------------
 table
----------------------------------------------------------- */

main article .table_box {
  position:relative;
  width:100%;
  max-width:1040px;
  margin:auto;
  height:calc(100vh - 300px);
  overflow-y:scroll;
  -webkit-overflow-scrolling:touch;
}
/*
main article .table_box {
  -ms-overflow-style:none;
  scrollbar-width:none;
}
main article .table_box::-webkit-scrollbar {display:none;}
*/
main article .table_box.lower {height:calc(100vh - 350px);}
main article table {
  width:100%;
  text-align:center;
}
main article table th {
  position: -webkit-sticky;
  position:sticky;
  height:40px;
  font-size:1.5rem;
  font-weight:normal;
  color:#FFFFFF;
  background:#F59601;
  border-right:solid 1px #FFFFFF;
  padding:5px 2px;
  top:0;
  z-index:10;
}
main article table th::after {
  position:absolute;
  display:block;
  content:"";
  width:100%;
  height:1px;
  background:#FFFFFF;
  bottom:0;
  left:0;
  
}
main article table tr:nth-of-type(1) th:nth-of-type(1) {border-radius:10px 0 0 0;}
main article table tr:nth-of-type(1) th:nth-last-of-type(1) {border-radius:0 10px 0 0;}
main article table tr:nth-of-type(2) th {top:40px;}
main article table td {
  min-height:50px;
  padding:5px;
  text-align:center;
  border-bottom:solid 1px #D8D6D5;
  border-right:solid 1px #FFFFFF;
}
main article table tr:nth-of-type(odd) td {background:#F7F8F8;}
main article table tr:nth-of-type(even) td {background:#EFEFEF;}
main article table .w01 {width:5%;}
main article table .w02 {width:10%;}
main article table .w03 {width:20%;}
main article table td.w03 { 
  text-align:left;
  padding:0 0 0 1em;
}
main article table td img {display:block;margin:0 auto;}

@media screen and (max-width: 767px){ 
  
  main article .table_box {
    overflow-x:scroll;
    height:calc(100% - 100px);
    -webkit-overflow-scrolling:touch;
  }
  main article .table_box.lower {height:calc(100% - 150px);}
  
  main article table {width:200%;}
  main article table th {
    height:36px;
    font-size:1.3rem;
  }
  main article table tr:nth-of-type(1) th:nth-of-type(1) {border-radius:5px 0 0 0;}
  main article table tr:nth-of-type(1) th:nth-last-of-type(1) {border-radius:0 5px 0 0;}
  main article table tr:nth-of-type(2) th {top:36px;}
  main article table td {
    min-height:30px;
  }
  main article table td img {height:30px;}
}

/* :::::::::: point/print :::::::::: */

main.page_point {padding:90px 20px 150px;}
.point_caution {
  text-align:center;
  margin:0 auto 2rem;
}
.point_caution .excel_span {
  display:block;
  font-size:1.3rem;
  width:140px;
  margin:1rem auto 0;
  padding:0.1rem 1.5rem;
  border:solid 1px #655D5B;
  border-radius:1rem;
}
.point_box {
  width:100%;
  max-width:1000px;
  text-align:center;
  padding:80px 20px 50px;
  margin:0 auto 40px;
  background:#FFFFFF;
  border-radius:10px;
}
.point_box h3 {
  font-size:1.8rem;
  margin:0 auto 40px;
}
.point_list {
  width:100%;
  max-width:634px;
  font-size:0;
  padding:2px;
  margin:0 auto;
  overflow:hidden;
}
.point_list li {
  display:inline-block;
  width:auto;
  min-width:180px;
  height:auto;
  line-height:1.2;
  font-size:1.5rem;
  font-weight:bold;
  margin:0 15px 30px;
}
.point_list li a {
  display:block;
  color:#FFFFFF;
  background:#F59601;
  padding:0.8em 0.5em 0.65em;
  border-radius: 20px;
  box-shadow:0 0 2px 1px rgba(101,93,91,0.3);
  text-decoration:none;
  opacity:1;
  transition:0.5s;
}
.point_list li a:hover {opacity:0.6;}
.point_list li a.dead_link {
  pointer-events:none;
  background:#D8D6D5;
}
.btn_close {
  width:240px;
  height:40px;
  line-height:40px;
  font-size:1.5rem;
  font-weight:bold;
  text-align:center;
  margin:0 auto;
}
.btn_close a {
  display:block;
  color:#FFFFFF;
  background:#D8D6D5;
  padding:0 0.5em;
  border-radius: 20px;
  box-shadow:0 0 2px 1px rgba(101,93,91,0.3);
  text-decoration:none;
  opacity:1;
  transition:0.5s;
  cursor:pointer;
}
.btn_close a:hover {opacity:0.6;}
.point_table {
  width:100%;
  max-width:800px;
  margin:0 auto;
}
.point_table tr th {
  color:#655D5B;
  background:#FACA80;
  border:none;
  border-top:solid 1px #FFFFFF;
}
.point_table tr th::after {content:none;}
.point_table tr:nth-of-type(1) th:nth-of-type(1) {
  color:#FFFFFF;
  background:#F59601;
  border-radius:10px 10px 0 0;
  border-top:none;
}
.point_table tr th + th {border-left:solid 1px #FFFFFF;}
.point_table tr td {
  border:none;
  text-align:center;
  border-top:solid 1px #D8D6D5;
  padding:10px;
}
.point_table tr td:nth-of-type(1) {background:#F7F8F8;}
.point_table tr td + td {border-left:solid 1px #D8D6D5;}
.point_table tr td .point_list li {
  display:block;
  min-width:150px;
  max-width:150px;
  margin:10px auto;
}


@media screen and (max-width: 767px){ 

  /* :::::::::: point/print :::::::::: */

  main.page_point {padding:80px 4% 100px;}
  .point_caution .excel_span {
    font-size:1.2rem;
    width:140px;
  }
  .point_box {
    padding:5% 4% 3%;
    margin:0 auto 6%;
  }
  .point_box h3 {
    font-size:1.6rem;
    margin:0 auto 5%;
  }
  .point_list li {
    width:48%;
    min-width:120px;
    font-size:1.3rem;
    margin:0 4% 4% 0;
    float:left;
  }
  .point_list li:nth-child(even) {margin:0 0 4%;}
  .btn_close {
    width:180px;
    height:30px;
    line-height:30px;
    font-size:1.3rem;
  }
  .point_table tr:nth-of-type(1) th:nth-of-type(1) {border-radius:5px 5px 0 0;}
  .point_table tr td {padding:4%;}
  .point_table tr td .point_list li {
    width:100%;
    min-width:auto;
    max-width:180px;
    margin:5% auto;
    float:none;
  }
  
}