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

  /*common*/
  * {
    font-size: 13px;
  }
  .wrapper,
  #container {
    width: 100%;
    padding: 0 20px;
  }
  main#main.top {
    width: 100%;
  }
  main#main,
  div#sidebar,
  nav#glnv ul {
    width: 100%;
    float: none;
  }
  body {
    margin-top: 70px;
  }
  .flowBox p.flowNum span {
    font-size: 13px;
  }
  article.tour h3.hStPrc span {
    font-size: 15px;
  }
  .hBgO, .hBgA,
  .hBg,
  .hGrn,
  .hGrnMin,
  .hOrg,
  .hTya,
  .hMin.mini,
  h3.hGrnBoD {
    font-size: 16px;
  }
  .hMin,
  .tourTtl {
    font-size: 17px;
  }
  .accL a.btnBlue, .accL a.btnWhite {
    width: 260px;
  }
  .hBgO .fRight, .hBgA .fRight,
  .hBg .fRight {
    display: block;
    font-size: 12px;
    float: none !important;
  }
  .btn-wrap > *:not(:last-child) {
    margin-right: 0;
    margin-bottom: 10px;
  }
  .pdf-right,
  .pdf-left {
    width: 100%;
  }

  /*display*/
  h1,
  ul#headNav1,
  ul#headNav2,
  .pc {
    display: none;
  }
  .sp,
  nav#glnv ul li.sp {
    display: block;
  }

  #spMenu {
    display: block;
    margin: 0;
    width: 50px;
    text-align: center;
    border-radius: 5px;
    position: absolute;
    right: 6px;
    top: 6px;
  }
  #spMenu p {
    color: #01539C;
    position: relative;
    display: block;
    -webkit-transition: all .4s;
    transition: all .4s;
    box-sizing: border-box;
  }
  #spMenu p.label {
    font-size: 10px;
    position: absolute;
    top: 28px;
  }
  #spMenu span {
    position: absolute;
    display: inline-block;
    width: 30px;
    height: 2px;
    background-color: #01539C;
    border-radius: 2px;
    -webkit-transition: all .4s;
    transition: all .4s;
    box-sizing: border-box;
    left: 5px;
  }
  #spMenu span:nth-of-type(1) {
    top: 8px;
  }
  #spMenu span:nth-of-type(2) {
    top: 16px;
  }
  #spMenu span:nth-of-type(3) {
    top: 24px;
  }
  #spMenu span:nth-of-type(2)::after {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background-color: #01539C;
    border-radius: 2px;
    -webkit-transition: all .4s;
    transition: all .4s;
  }
  #spMenu.active span:nth-of-type(2) {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  #spMenu.active span:nth-of-type(2)::after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
  }
  #spMenu.active span:nth-of-type(1) {
    -webkit-transform: translateY(20px) scale(0);
    -ms-transform: translateY(20px) scale(0);
    transform: translateY(20px) scale(0);
  }
  #spMenu.active span:nth-of-type(3) {
    -webkit-transform: translateY(-20px) scale(0);
    -ms-transform: translateY(-20px) scale(0);
    transform: translateY(-20px) scale(0);
  }

  /*header*/
  header#header {
    width: 100%;
    height: 60px;
    border-bottom: 5px solid #0054a3;
    background: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
    position: fixed;
    top: 0;
    z-index: 9999;
  }
  #logo {
    width: 200px;
    display: block;
  }
  nav#glnv {
    display: none;
    width: 100%;
    background: #fff;
    position: absolute;
    top: 60px;
    z-index: 10;
  }
  nav#glnv ul {
    display: block;
  }
  nav#glnv ul li,
  nav#glnv ul li.navLast {
    width: 100%;
    display: block;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid #ccc;
  }
  nav#glnv ul li.long a {
    background: url("https://biomass-tour-maniwa.jp/cms/wp-content/themes/biomss/common/img/arrow_b.png") no-repeat 97% center;
  }
  nav#glnv ul li a {
    color: #0054a3;
    height: auto;
    text-align: left;
    padding: 11px 15px;
    line-height: normal;
    background: url("https://biomass-tour-maniwa.jp/cms/wp-content/themes/biomss/common/img/arrow_b.png") no-repeat 95% center;
  }
  nav#glnv ul li a:hover {
    background: url("https://biomass-tour-maniwa.jp/cms/wp-content/themes/biomss/common/img/arrow_b.png") no-repeat 95% center;
  }
  nav#glnv ul li a:hover::after {
    display: none;
  }
  nav#glnv ul li a span {
    position: static;
    transform: none;
  }
  nav#glnv ul li a br {
    display: none;
  }
  nav#glnv ul.child {
    position: static;
    width: 100%;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-top: 1px solid #ccc;
    background: #0054A3;
  }
  nav#glnv ul.child li:last-of-type {
    border-bottom: none;
  }
  nav#glnv ul.child li a {
    color: #fff;
    border-bottom: none;
    background: #0054A3;
  }
  nav#glnv ul li a.open {
    background: url("https://biomass-tour-maniwa.jp/cms/wp-content/themes/biomss/common/img/arrow_b1.png") no-repeat 95% center;
  }
  nav#glnv ul li a.open.act {
    background: url("https://biomass-tour-maniwa.jp/cms/wp-content/themes/biomss/common/img/arrow_b2.png") no-repeat 95% center;
  }

  /*sidebar*/
  ul.sideBnr {
    margin-bottom: 0;
    clear: both;
  }
  ul.sideBnr li {
    width: 49%;
    text-align: center;
    float: left;
  }
  ul.sideBnr li:nth-of-type(2n) {
    float: right;
  }

  /*footer*/
  footer#footer {
    margin-top: 30px;
  }
  footer#footer #logoF {
    float: none;
    width: 193px;
    margin: 0 auto 10px;
    display: block;
  }
  footer#footer address#address,
  footer#footer #subAddress {
    float: none;
    margin-left: 0;
    text-align: center;
  }
  footer#footer address#address p, footer#footer #subAddress p {
    font-size: 12px;
  }
  footer#footer .wrapper {
    display: block;
  }

  .hisImgR,
  .knkR,
  #gourmet .menu>img {
    width: auto;
    float: none;
    display: block;
    margin: 0 auto 10px;
  }
  .hisTxtR,
  .itvTxtL,
  .itvTxtR,
  .abtL,
  .ivwTxtL,
  .ivwTxtR,
  .sttL,
  .knkL,
  .kankoL,
  #kankoLink p,
  .kankoR,
  article.price .stayPrcBox.min,
  .half,
  .accL,
  .accR,
  article.areaBox .areaList,
  article.areaBox .areaImg,
  #gourmet .menu,
  ul.yakkanBtnList li,
  .carL,
  .carR {
    width: 100%;
    float: none !important;
  }
  .carR {
    margin: 20px 0;
  }
  .offsetMark .markR {
    padding-left: 0;
  }
  .abtR, .sttR, .ivwImgR,
  .ivwImgL,
  .offsetMark .markL {
    text-align: center;
    float: none;
    margin-bottom: 20px;
  }
  table.linkList tr>*,
  table.tblSitemap tr>* {
    width: 100%;
    display: block;
  }
  .kankoR,
  .accR {
    text-align: center;
    margin-top: 20px;
  }
  .abtL,
  #gourmet .menu,
  .borBoxGrn {
    margin-bottom: 20px;
  }
  #kankoLink,
  ul.yakkanBtnList li {
    text-align: center;
  }
  #kankoLink .fRight {
    float: none !important;
  }
  #buyWrap,
  #offerShop,
  #offerShop > * {
    display: block;
  }
  #buyWrap .buyInfo,
  #access table,
  table.tblPriceStay {
    width: 100%;
  }
  article.price h3.hStPrc span {
    padding: 5px 20px;
  }
  #offerShop .ttl {
    width: 100%;
  }
  #offerShop .count {
    font-size: 16px;
    padding-left: 0;
  }
  article.areaBox p.ex {
    left: auto;
  }
  article.areaBox .head h4.hArea {
    width: auto;
    float: none;
    padding: 5px 0;
  }
  
  article.areaBox .head p {
    padding-left: 0;
    margin-top: 10px;
  }
  ul#listTopics li a {
    width: 100%;
    padding-left: 0;
  }
  .voiceEntry .voicePhoto {
    width: 60px;
  }
  .voiceEntry .voiveCmt {
    width: calc(100% - 80px);
  }
  .voiceEntry .voiveCmt h2 {
    font-size: 13px;
  }
  table.linkList tr th {
    border-bottom: none;
    padding: 10px 0 0 15px;
    background: url("https://biomass-tour-maniwa.jp/cms/wp-content/themes/biomss/common/img/arrow_g.png") no-repeat left 17px;
  }
  table.linkList tr td {
    padding-bottom: 10px;
  }
  .flowBox p.flowNum {
    width: 80px;
    font-size: 17px;
  }
  .flowBox {
    padding-left: 90px;
    background: url("https://biomass-tour-maniwa.jp/cms/wp-content/themes/biomss/common/img/subscription/arrow_flow.png") no-repeat 20px bottom;
  }
  #stayPrice a.btnWhite,
  section#carbon article .carbonLink {
    position: static;
    margin-top: 10px;
  }
  section#carbon article .carbonLink {
    text-align: right;
  }

  #awardList {
    padding: 15px;
    background: none;
  }
  .awdWrap,
  .awdWrapBg {
    display: block;
  }
  .awdWrapBg {
    padding: 10px;
  }
  .awdWrap .awdL p span.cap {
    font-size: 14px;
  }
  .awdWrap .awdL p {
    font-size: 18px;
  }
  .awdWrap .awdL .awardName {
    font-size: 20px;
  }
  .awdWrap .awdL .awardName img {
    width: 45px;
    height: auto;
  }
  .awdWrap .awdR {
    text-align: center;
    margin-top: 20px;
  }
  .awdWrapBg .title {
    width: 100%;
    font-size: 16px;
    padding: 10px 0px;
  }
  .awdWrapBg .content {
    max-width: 100%;
    margin-top: 10px;
  }


  section#contact table tr>* {
    display: block;
    width: 100%;
    padding: 10px;
    border-bottom: none;
  }
  section#contact table tr:last-of-type>* {
    border-bottom: 1px solid #ccc;
  }
  input[type="text"],
  input[type="email"],  
  input[type="tel"], 
  input[type="password"], 
  select, textarea {
    width: 100%;
    font-size: 16px;
  }
  input[type="number"] {
    font-size: 16px;
  }

  ul.timeLine,
  .ePrice .bgBoxO p {
    width: 100%;
  }
  .hTime {
    font-size: 15px;
    padding: 0 10px;
  }
  .timeTtl,
  .ePrice .bgBoxO p .price {
    font-size: 15px;
  }
  .eSchedule h3.ttlSch,
  .ePrice h3 {
    font-size: 20px;
    text-align: left;
  }
  .hTime span {
    display: block;
  }
  .timeLinePhoto img {
    margin-bottom: 20px;
  }
  .eSchedule,
  .ePrice {
    padding: 10px;
    display: block;
  }
  .eSchedule div:first-of-type {
    margin-bottom: 20px;
  }
  .eSchedule p {
    min-height: auto
    margin-bottom: 10px;
  }
  .ePrice .bgBoxO > * {
    display: block;
  }
  ul.btnWrap li {
    margin: 10px 0;
  }

  /*toppage*/
  nav#sliderNav ul {
    display: block;
  }
  nav#sliderNav ul li,
  #fb {
    width: 100%;
  }
  #fb {
    margin-bottom: 20px;
  }
  nav#sliderNav ul li a {
    padding-bottom: 0;
    text-align: left;
    padding: 5px 10px;
    font-size: 14px;
  }
  nav#sliderNav ul li a img {
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 10px;
    width: 60px;
  }
  nav#sliderNav ul li a br {
    display: none;
  }
  #sliderArea {
    margin-left: -20px;
    margin-right: -20px;
  }
  .slick-arrow {
    display: none !important;
  }
  .halfFlex {
    display: block;
  }
  .halfFlex > * {
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
  }
  ul.topBtn li {
    width: 100%;
  }
  ul.topBtn li a.btn02 {
    padding: 15px 0;
    font-size: 14px;
  }
  #topAbout p {
    text-align: left;
  }
  #topAbout h2.hTopAbout {
    font-size: 18px;
    text-align: left;
    margin-bottom: 5px;
  }
  ul#listTopics li {
    text-align: left;
    padding: 10px 0 10px 0;
  }
  #pagebanner ul.banners li {
    width: 49%;
    margin-right: 0;
    margin-bottom: 10px;
  }
  #pagebanner ul.banners li:nth-of-type(odd) {
    margin-right: 2%;
  }


  /*course*/
  #expMenu {
    border-bottom: none;
    margin-bottom: 0;
  }
  #expMenu ul li {
    width: 48%;
    margin-bottom: 10px;
  }
  #expMenu ul li a {
    width: 100%;
    min-height: 70px;
    border-bottom: 1px solid #a0a0a0;
  }
  .flowTime span {
    display: block;
  }
  .flowItem {
    display: block;
  }
  .flowItem .image {
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
  }
  .flowItem .text {
    width: 100%;
  }
  .hFlowCrs {
    text-align: left;
    font-size: 16px;
  }
  .flowItem p.time {
    font-size: 18px;
    display: inline-block;
    width: 70px;
  }
  .flowItem p.time span {
    font-size: 13px;
  }
  .flowItem .head {
    display: block;
    text-align: right;
  }
  .btnOrg2, .btnBlue2 {
    width: 100%;
  }
  p .btnOrg2 {
    margin-top: 10px;
  }


  /*media*/
  ul#listTopics li {
    padding-left: 15px;
  }
  ul#listTopics li time {
    padding-left: 0;
  }
  ul#listTopics li a {
    margin-left: 0;
  }


  /*join-voice*/
  .ttlJoin {
    font-size: 17px;
    text-align: center;
  }
  .ttlJoin img {
    display: block;
    margin: 0 auto 10px;
  }
  .ttlJoinSub {
    font-size: 17px;
  }
  .joinWrap {
    display: block;
  }
  .joinWrap .image {
    text-align: center;
  }
  .joinWrap .info {
    width: 100%;
  }


  /*option-course*/
  ul#courseList li,
  ul#courseList li:nth-of-type(3n) {
    width: 48%;
    margin-right: 4%;
  }
  ul#courseList li:nth-of-type(even) {
    margin-right: 0;
  }
  ul#courseList h3 {
    font-size: 12px;
  }
  .eventBox {
    width: 100%;
  }
  .eventBox:first-of-type {
    margin-top: 10px;
  }
  .btns a {
    margin-bottom: 10px;
  }
  #courseContent {
    padding: 15px;
  }
  h3.optionTtl {
    font-size: 16px;
  }
  h3.optionTtl span.id {
    font-size: 12px;
    padding: 2px 5px;
  }
  .optionPhoto .image {
    width: 48%;
  }
  .optionPhoto .image:last-of-type {
    margin-top: 8px;
  }
  #courseContent .btns {
    display: block;
  }
  #courseContent .btns a {
    width: 100%;
    margin-bottom: 5px;
  }

  /*experience*/
  .formBtn {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .formBtn input[type="reset"] {
    order: 2;
  }
  .formBtn input {
    width: 100%;
    margin-bottom: 10px;
  }
  #expWrap {
    padding: 0;
  }
  #expWrap a.menu {
    width: 100%;
  }
  #expWrap a.menu .menuImg {
    width: 100%;
    height: auto;
  }


  /*award*/
  section#award .hMin {
    font-size: 16px;
  }
  .hBor {
    font-size: 16px;
  }


  /*history*/
  .itvImgR,
  .itvImgL {
    float: none;
    display: block;
    margin: 15px auto 0;
  }


  /*english*/
  .timeLinePhoto {
    width: 100%;
    float: none;
    text-align: center;
  }


  /*calender*/
  #calContact {
    border: 5px solid #cce4b5;
    padding: 15px;
    margin-bottom: 20px;
  }
  #calContact p.ttl {
    font-size: 18px;
  }
  #calContact div {
    margin-bottom: 10px;
  }
  #calenderWrap > div {
    width: 100%;
  }

  /*calendar-new*/
  .monthly-calendar table tr>* {
    font-size: 10px;
  }
  #entryModalWrap {
    padding-right: 20px;
    padding-left: 20px;
  }
  #modalBox {
    max-width: calc(100% - 40px);
  }
  #modalBox .date,
  #modalBox .inner {
    padding-right: 20px;
    padding-left: 20px;
  }
  .btnWrap.item2 > * {
    max-width: 49%;
    font-size: 11px;
  }
  .btnWrap.item2 {
    justify-content: space-around;
  }
  .btnWrap.item2 > *:first-of-type {
    margin-right: 0;
  }
  .tableType1.wide tr>* {
    display: block;
    width: 100%;
  }
  .ibItem {
    display: block;
  }
  .ibItem:first-of-type {
    margin-bottom: 10px;
  }
  input[type="text"].min,
  input[type="email"].min,
  input[type="number"].min,
  input[type="tel"].min,
  input[type="password"].min,
  textarea.min {
    width: 70px;
  }
  select.min, {
    width: 100%;
  }

  .monthly-calendar table tr>* {
    display: block;
    width: 100%;
    padding: 0;
  }
  .monthly-calendar table tbody td {
    height: auto;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -ms-align-items: center;
    align-items: center;
    border-bottom: none;
  }
  .monthly-calendar table tbody tr:last-of-type td:last-of-type {
    border-bottom: 1px solid #9f9f9f;
  }
  .monthly-calendar table tbody td::before,
  .monthly-calendar div.day {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    width: 35px;
    height: 35px;
    border-right: 1px solid #9f9f9f;
    margin-bottom: 0;
  }
  .monthly-calendar div.day {
    margin-right: 10px;
  }
  .monthly-calendar table tbody td:nth-of-type(1)::before {content: "日"}
  .monthly-calendar table tbody td:nth-of-type(2)::before {content: "月"}
  .monthly-calendar table tbody td:nth-of-type(3)::before {content: "火"}
  .monthly-calendar table tbody td:nth-of-type(4)::before {content: "水"}
  .monthly-calendar table tbody td:nth-of-type(5)::before {content: "木"}
  .monthly-calendar table tbody td:nth-of-type(6)::before {content: "金"}
  .monthly-calendar table tbody td:nth-of-type(7)::before {content: "土"}
  .monthly-calendar table tr>*:empty {
    display: none;
  }
  .monthly-calendar table thead {
    display: none;
  }
  .monthly-calendar span:not(.day) {
    width: 90px;
    font-size: 12px;
    border-bottom: none;
    padding: 5px;
  }
  .monthly-calendar span:not(.day).group {
    margin-right: 5px;
  }

  .monthly-calendar .week-title {
    display: none;
  }

  /*subscription*/
  ul.listDisc.cancel .title {
    width: 100%;
  }

}