@charset "UTF-8";


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

/* =====<=====<=====<=====<=====<=====<===== */
/* !<- GENERAL control ->                    */
/* =====>=====>=====>=====>=====>=====>===== */

body {
  min-width: 320px;
}
p {
  font-size: 14px;
  line-height: 1.9;
}
p+p{
  margin-top: 1em;
}

img {
  width: 100%;
  height: auto;
}
.call a {
  pointer-events: auto;
}
.co {
  margin-top: 5px;
  font-size: 14px;
  line-height: 1.4;
}
#GNav a.now {
  color: #01a396;
}



/* =====<=====<=====<=====<=====<=====<===== */
/* subpage general control                   */
/* =====>=====>=====>=====>=====>=====>===== */

.sub section {
  padding: 50px 0;
}




/* =====<=====<=====<=====<=====<=====<===== */
/* !<- WRAPPER & INNER control ->            */
/* =====>=====>=====>=====>=====>=====>===== */

.inner {
  width: 95%;
}




/* =====<=====<=====<=====<=====<=====<===== */
/* !<- HEADDING control ->                   */
/* =====>=====>=====>=====>=====>=====>===== */

h1 {
  top: -12px;
  left: 15px;
  font-size: 11px;
}
h2 {
  font-size: 20px;
  text-align: left;
}



/* =====<=====<=====<=====<=====<=====<===== */
/* !<- TOP-HEADER control ->                 */
/* =====>=====>=====>=====>=====>=====>===== */
#TH {padding: 20px 0;}
#TH .fx {
  width: 95%;
  overflow: visible;
}


.hdrLogo {width: 150px; margin: 5px auto 0;}
.hdrLogo img{width: 100%; height: auto }

.ctcBox,.mailmagazine {
  display: none;
}
#TH .ctcBox p,#TH .mailmagazine p {
  margin-top: .5em;
  font-size: 13px;
  line-height: 2;
}


/* =====<=====<=====<=====<=====<=====<===== */
/* !<- GLOBAL-NAV control ->                 */
/* =====>=====>=====>=====>=====>=====>===== */

.menu-trigger,
.menu-trigger span{
  display: none!important;
}
.menu-trigger,
.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.menu-trigger {
	width: 30px;
	height: 16px;
  position: fixed;
  z-index: 101;
  top: 30px;
  left: 2.5%;
  margin-left: .5%;
}
.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
  box-shadow: 0 0 3px #eee;
	background-color: #1466a1;
	border-radius: 4px;
}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger span:nth-of-type(2) {
	top: 7px;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}

.menu-trigger.active span:nth-of-type(1) {
	-webkit-transform: translateY(20px) rotate(-45deg);
	transform: translateY(7px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
	opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
	-webkit-transform: translateY(-20px) rotate(45deg);
	transform: translateY(-7px) rotate(45deg);
}



#GNav {
  width: 100%;
  position: fixed;
  top: 0;
  display: none;
  z-index: 100;
  height: 100vh;
  padding-bottom: 0;
  background: #fff;
}
#GNav ul {
  display: block;
  margin-top: 14vh;
}

#GNav a {
  display: block;
  padding: 1.2em 0;
  color: #1466a1;
}
#GNav li i {display: none;}


/* =====<=====<=====<=====<=====<=====<===== */
/* !<- MAIN-VISUAL control ->                */
/* =====>=====>=====>=====>=====>=====>===== */
#MV {
  width: 100%;
  height: 230px;
  background: url(../../img/co/MV.jpg);
  background-position: 15% center;
  background-size: cover;
}



/* =====<=====<=====<=====<=====<=====<===== */
/* !<- SUB-VISUAL control ->                 */
/* =====>=====>=====>=====>=====>=====>===== */


/* =====<=====<=====<=====<=====<=====<===== */
/* !<- SECTION control ->                    */
/* =====>=====>=====>=====>=====>=====>===== */

article {
  margin-top: 0;
  padding-top: 0;
  background: none;
}
section {padding: 50px 0; }
section .cntBox header {
  margin-top: 50px;
}
section .cntBox header h2 {
  margin-left: 0px;
}
section .cntBox header span {
  width: 35px;
  display: block;
  top: -42px;
  left: 0;
  padding: .1em 0;
  font-size: 30px;
  transform: rotate(0);
  text-align: left;
  border-top:0;
  border-bottom:2px solid
}
section .inner:nth-of-type(1) .cntBox:nth-of-type(1) header span {
  color:#004986
}


/* =====<=====<=====<=====<=====<=====<===== */
/* !<- FOOTER control ->                     */
/* =====>=====>=====>=====>=====>=====>===== */

footer {
  padding-top: 45px;
  overflow: visible;
  background: #1466a1;
}
#ftrLogo {
  padding-bottom: 30px;
  border-bottom:1px solid rgba(255,255,255,.3)
}
#ftrLogo img {
  width: 245px;
  margin: 0 auto;
}
#pagetop {
  bottom: auto;
  right: 0;
  top: -35px;
}

footer .ctcBox,
footer .mailmagazine {
  width: 48%;
  display: block;
  margin-top: 30px;
}
footer .ctcBox img,
footer .mailmagazine img {
  width: 100%;
}
.ctcBox+p {
  width: 100%;
  display: inline-block;
  padding: 15px 2.5% 30px ;
  border-bottom: 1px solid rgba(255,255,255,.3);
  clear: both;
  font-size: 15px;
  color: #fff;
}
footer .inner {
  width: 100%;
}
footer .ctcBox{
 float: left;
padding-left: 2.5%;
}
footer .mailmagazine{
   float: right;
  padding-right: 2.5%;

}

/*===== #ftrNav =====*/
#ftrNav {clear: both;}
#ftrNav ul {
  width: 100%;
  padding: 0 ;
  display: block;
}
#ftrNav ul li:last-child {
  text-align: left;
}
#ftrNav ul li:last-child i {
  display: block;
}
#ftrNav ul li:last-child a {
  line-height: inherit;
}

#ftrNav ul li {
  display: block;
  background: #fff;
}
#ftrNav ul li+li {
  border-top:1px solid rgba(20, 102, 161,.3);
}

#ftrNav ul a {
  display: block;
  padding: .8em 4% .7em;
  color:#1466a1;
  line-height: inherit;
}
#ftrNav i {
  margin-top: .3em;
  float: right;
}


/*===== PAGETOP =====*/
#pagetop img {
  width: 75px;
}

/* =====<=====<=====<=====<=====<=====<===== */
/* !<- SPECIAL DECO control ->               */
/* =====>=====>=====>=====>=====>=====>===== */

/*===== { btn } =====*/
.btn {
  width: 300px;
  margin: 50px auto 0;
}

/* =====<=====<=====<=====<=====<=====<===== */
/* !<- ORDERD SKIN / index.html ->           */
/* =====>=====>=====>=====>=====>=====>===== */
#sec01 {
  padding-top: 50px;
  padding-bottom: 0;
  position: relative;
}
#sec01 .inner:nth-of-type(2n) {
  width: 95%
}
#sec01 .cntBox figure {
  width: 100%;
  margin-bottom: 30px;
}
#sec01 .cntBox figure img {
  width: 100%;
  height: auto;
}

#sec01 .inner .cntBox {
  margin-bottom: 50px;
  position: relative;
}

#sec01 .inner .cntBox>img {
  width: 17px;
  height: auto;
  top: 150px;
  opacity: .5;
  z-index: 3;
}
#sec01 .inner:nth-of-type(1) .cntBox>img {
  left:5px
}
#sec01 .inner:nth-of-type(2) .cntBox:nth-of-type(1)>img {
  right: auto;
  left: 5px;
}
#sec01 .inner:nth-of-type(2) .cntBox:nth-of-type(2)>img {
  right: auto;
  left: 5px;
}
#sec01 .inner:nth-of-type(3) .cntBox>img {
  left:5px
}
#sec01 .inner:nth-of-type(4) .cntBox:nth-of-type(1)>img {
  right: auto;
  left: 5px;
}
#sec01 .inner:nth-of-type(4) .cntBox:nth-of-type(2)>img {
  right: auto;
  left: 5px;
}





#sec01 .inner:nth-of-type(1) .cntBox {
  margin-bottom: 30px;
}

#sec01 .cntBox .left {
  width: 100%;
}
#sec01 .cntBox .right {
  width: 100%;
}

#sec01 .inner:nth-of-type(2n) .cntBox {
  width: 100%;
}


#sec01 .inner:nth-of-type(2n) .cntBox figure {
  margin-bottom: 30px;
}


#sec01 .inner:nth-of-type(3) .cntBox .right {
  width: 100%;
  float: none;
}
#sec01 .inner:nth-of-type(3) .cntBox .right .bottom {
  width: 100%;
}


#sec01 .inner:nth-of-type(2) .cntBox:nth-of-type(2) ,
#sec01 .inner:nth-of-type(4) .cntBox:nth-of-type(1) {
  margin-top: 0px;
}

#sec02 {
  padding-top: 50px;
}
#sec02 .inner {
  width: 95%;
}
#sec02 .cntBox {
  width: 100%;
  padding: 70px 0 50px;
  position: relative;
  overflow: visible;
  background: #fcfdfe;
}
#sec02 .cntBox h3 {
  width: 80%;
  top: -30px;
}

#sec02 .cntBox ul {
  width: 90%;
}
#sec02 .cntBox li {
  width: 100%;
  font-size: 15px;
}


#sec02 .cntBox + .cntBox {
  margin-top: 50px;
  height: auto;
  padding: 100px 0 30px;
  border:2px solid #f5f6c3;
  background: #004986;
  background-size: cover;
}
#sec02 .cntBox + .cntBox h3 {
  top: -25px;
}
#sec02 .cntBox + .cntBox h3 img {
  width: 90%;
}
#sec02 .cntBox + .cntBox p span {
  font-size: 1em;
}
#sec02 .cntBox + .cntBox p br:last-of-type {
  display: none;
}

#sec02 .cntBox + .cntBox p {
  width: 95%;
  margin: auto;
  font-size: 14px;
  text-align: left;
}


#sec03 {
  padding: 0 0 50px;
  padding-left: 0;
}
#sec03 .inner {
  width: 95%;
  border-left:0;
}
#sec03 h2 {
  padding-left:0;
  font-size: 18px;
}
#sec03 .cntBox {
  margin-top: 30px;
  padding-left: 0px;
}
#sec03 .cntBox::after {
  display: none;
}
#sec03 h3 {
  width: 20%;
}

#sec03 dl {
  width:75%
}
#sec03 dt {
  font-size: 15px;
}
#sec03 dt::before {
  width: 5px;
  height: 5px;
}
#sec03 dd {
  font-size: 13px;
}





#top #sec04 .cntBox .contactUs {
  padding-bottom: 0;
}
#sec04 {
  padding: 50px 0 80px;
}
#sec04 header {
  margin-bottom: 30px;
}
#sec04 header h2 {
  font-size: 22px;
  text-align: center;
}
#sec04 header h2 .hidden {
  display: block;
}
#sec04 .col_r {
  font-size: 22px;
}
#sec04 table th,
#sec04 table td {
  padding: .5em 0;
  display: block;
  font-size: 14px;
  vertical-align: top;
}
#sec04 table th {
  padding-bottom: 0;
}

#sec04 table tr:nth-last-of-type(2) td {
  padding-top: 0;
}
#sec04 table th {
  width: 150px;
  padding-right: 1em;
  font-weight: bold;
}
#sec04 table th::after {
  display: none;
}
#sec04 table td .col_r {
  font-size: 14px;
}
#sec04 table td span span{
  font-size: 1.1em;
}
#sec04 .map {
  margin-top: 50px;
  margin-bottom: 50px;
}
#sec04 .map iframe {
  width: 100%;
  height: 200px;
}
#sec04 .map h3 {
  width: 230px;
  top: -17px;
  color:#fff;
  font-size: 18px;
}
#sec04 p {
  font-size: 14px;
}

#sec04 .btn {
  width: 250px;
  font-size: 18px;
}
#sec04 .cntBox+.cntBox {
  margin-top: 50px;
}
#sec04 .cntBox:first-of-type {
  justify-content: space-between;
  flex-wrap: wrap;
}
#sec04 .cntBox:first-of-type header {
  width: 100%;
  padding-top: 0;
  margin-top: 0;
  margin-bottom: 30px;
}
#sec04 dl {
  width: 100%;
}
#sec04 dt {
  padding-bottom: 20px;
  font-size: 15px;
}
#sec04 dt span {
  display: block;
  font-weight: bold;
  font-size: 19px;
}
#sec04 dd {
  padding-top: 25px;
  padding-right: 0;
  padding-bottom: 20px;
  font-size: 14px;
  line-height: 2.1;
  letter-spacing: 1px;
}






}