@charset "UTF-8";


/*********************************
 * ～900
 *********************************/

@media screen and (max-width:900px){
  
  /* info */
  .info {width:90%; margin:12% auto 0 auto;}
  .info .inner {margin:2em 0 0 0;}
  .info .inner .photo {width:60%;}
  .info .inner .note {margin:1.5em 0 0 0; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}
  
  /* profile */
  .profile {width:90%; margin:22% auto 0 auto;}
  .profile .note {margin:2em 0 0 0; padding:2.2em 2em; border:4px solid #1e7835; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}
  
  /* office */
  .office {margin:25% 0 0 0;}
  .office .inner {margin:0 auto;}
  .office .inner .title {padding:2em 0 2em 5%; background:#6fc184 url(../../images/profile/profile_bg.jpg) right bottom no-repeat; background-size:40% auto;}
  .office .inner .title h2 {position:relative; display:flex; flex-wrap:wrap; color:#fff; font-size:150%; font-weight:600; line-height:1;}
  .office .inner .title h2::before {position:absolute; display:block; content:''; width:0.6em; height:1px; background:#fff; top:0.5em; left:0;}
  .office .inner .title h2 span {display:block; width:100%; padding:1em 0 0 0; font-family:'Lato', sans-serif; font-size:45%; letter-spacing:0.1em; font-weight:700;}
  .office .inner .data {width:90%; margin:0 auto;}
  .office .inner .data dl {width:100%; margin:1em 0 0 0;}
  .office .inner .data dl dt {display:block; padding:1.5em 1.5em 0 1.5em; font-weight:600;}
  .office .inner .data dl dd {padding:0.3em 1.5em 1.5em 1.5em; border-bottom:1px solid #7f7f7f;}
  
  /* access */
  .access {margin:25% 0 0 0;}
  .access .inner {width:94%; max-width:1200px; margin:0 auto;}
  .access .gmap {margin:2em 0 0 0;}
  .access .gmap iframe {width:100%; height:30em;}

}



/*********************************
 * 901～
 *********************************/

@media screen and (min-width:901px) {
  
  /* info */
  .info {width:94%; max-width:1200px; margin:8% auto 0 auto;}
  .info .inner {display:flex; justify-content:space-between; width:100%; margin:2.5em 0 0 0;}
  .info .inner .photo {width:30%;}
  .info .inner .note {width:63%; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}
  
  /* profile */
  .profile {width:94%; max-width:1200px; margin:10% auto 0 auto;}
  .profile .note {margin:2.5em 0 0 0; padding:2.8em 4em; border:4px solid #1e7835; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}
  
  /* office */
  .office {margin:12% 0 0 0; background:linear-gradient(to right, #6fc184 46%, transparent 46%);}
  .office .inner {position:relative; display:flex; justify-content:space-between; width:100%; max-width:1200px; margin:0 auto; padding:0 3%; background:url(../../images/profile/profile_bg.jpg) left bottom no-repeat; background-size:46% auto; z-index:+1;}
  .office .inner .title {width:46%; padding:5em 4% 0 0; background:linear-gradient(to left, #fff 10%, transparent 10%);}
  .office .inner .title h2 {display:flex; flex-wrap:wrap; position:relative; padding:0 0 1em 1em; color:#fff; font-size:190%; font-weight:600; line-height:1;}
  .office .inner .title h2::before {position:absolute; display:block; content:''; width:0.6em; height:1px; background:#fff; top:0.5em; left:0;}
  .office .inner .title h2 span {display:block; width:100%; padding:1em 0 0 0; font-family:'Lato', sans-serif; font-size:40%; letter-spacing:0.1em; font-weight:700;}
  .office .inner .data {width:49%; padding:5em 0; font-size:95%;}
  .office .inner .data dl {width:100%; border-top:1px solid #7f7f7f;}
  .office .inner .data dl dt {display:block; padding:1.5em 1.5em 0 1.5em; font-weight:600;}
  .office .inner .data dl dd {padding:0.5em 1.5em 1.5em 1.5em; border-bottom:1px solid #7f7f7f;}
  
  /* access */
  .access {margin:12% 0 0 0;}
  .access .inner {width:94%; max-width:1200px; margin:0 auto;}
  .access .gmap {margin:2.5em 0 0 0;}
  .access .gmap iframe {width:100%; height:30em;}

}