@charset "UTF-8";


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

@media screen and (max-width:900px){
  
	main h2 {width:90%; margin-right:auto; margin-left:auto;}
 
  table.profile {width:100%; margin:1.5em 0 0 0; border-top:1px dotted #7f7f7f;}
  table.profile th {display:block; padding:1em 0 0 0; border:0; font-size:110%; font-weight:600;}
  table.profile td {display:block; padding:0.5em 0 1.5em 0; border-bottom:1px dotted #7f7f7f;}
 
  main h2 + .ptxt {width:90%; margin:1em auto 0 auto; font-weight:500; line-height:2;}
  main h2:first-child {margin:3em auto 0 auto;}
  main h2:first-child + .ptxt {margin:2em auto 0 auto;}
  main h2:first-child + .ptxt::after {clear:both;}
  main h2:first-child + .ptxt .fl_left {padding-bottom:1.5em;}
  main h2:first-child + .ptxt .fl_left img {width:60%;}
  
  main h2:first-child {margin:3em auto 0 auto;}
  .area2 {width:90%; margin:2em auto 0 auto;}
  .area2 .ptxt .fleft {width:60%;}
  .area2 .ptxt .fright {margin:1.5em 0 0 0; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}
  
  .area3 {width:90%; margin:0 auto;}
  .area3 .ptxt {margin:0;}
  .area3 .ptxt .fleft {margin:1em 0 0 0; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}
  .area3 .ptxt .fright {width:60%;}
  
  /*.area2 + h2 + .ptxt {width:90%; margin:2em auto 0 auto; padding:1.5em 2em; border:2px solid #327eae; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}*/
  .area2 + h2 + .ptxt table {width:100%; border:0;}
  .area2 + h2 + .ptxt table th {display:block; padding:0.8em 0 0 0; border:0; font-weight:600;}
  .area2 + h2 + .ptxt table td {display:block; padding:0.5em 0 1.2em 0; border-bottom:1px dotted #7f7f7f;}
	.area2 + h2 + .ptxt table tr:last-child td {border:0;}
  
  /* office */
  .office {margin:25% 0 0 0;}
  .office .inner {margin:0 auto;}
  .office .inner .title {padding:2em 0 2em 5%; background:#77bae8 url(../images/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;}
  
  iframe.gm {width:100%; height:30em; margin:2em 0 0 0;}
  
	main .btn {width:12em; margin:1.5em auto 0 auto; font-size:90%; text-align:center;}
	main .btn a {position:relative; display:block; padding:0.3em 0; background:#327eae; color:#fff; text-decoration:none;}
	main .btn a::after {position:absolute; display:block; content:''; width:0.4em; height:0.4em; right:1.5em; top:40%; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(45deg);}

}



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

@media screen and (min-width:901px) {

	main h2 {width:94%; max-width:1200px; margin:0 auto;}
 
  table.profile {margin-top:2.5em; width:100%; border-top:1px solid #7f7f7f;}
  table.profile th {width:30%; padding:1em 1.5em; border-bottom:1px solid #7f7f7f; font-weight:600; vertical-align:top;}
  table.profile td {padding:1em 1.5em; border-bottom:1px solid #7f7f7f;}
  
  main h2 + .ptxt {width:94%; max-width:1200px; margin:1em auto 0 auto; font-weight:500; line-height:2;}
  main h2:first-child {margin:3em auto 0 auto;}
  main h2:first-child + .ptxt {margin:2.5em auto 0 auto;}
  main h2:first-child + .ptxt::after {clear:both;}
  main h2:first-child + .ptxt .fl_left {float:left; display:inline-block; width:21%; margin:0 5% 2em 0;}
  
  main h2:first-child {margin:3em auto 0 auto;}
  .area2 {width:94%; max-width:1200px; margin:2em auto 0 auto;}
  .area2 .ptxt {align-items:center;}
  .area2 .ptxt .fleft {width:30%;}
  .area2 .ptxt .fright {width:65%; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}
  
  .area3 {width:94%; max-width:1200px; margin:2em auto 0 auto;}
  .area3 .ptxt {display:flex; justify-content:space-between; width:100%; margin:2.5em 0 0 0;}
  .area3 .ptxt .fleft {font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}
  .area3 .ptxt .fright {}
  
  .ptxt + h2,
  .area2 + h2,
  .area3 + h2 {margin:5em auto 0 auto;}
  /*.area2 + h2 + .ptxt {width:94%; max-width:1200px; margin:2.5em auto 0 auto; padding:2.8em 4em 1.8em 4em; border:4px solid #327eae; font-weight:500; line-height:2; text-align:justify; text-justify:inter-ideograph;}*/
  .area2 + h2 + .ptxt table {margin-top:0; width:100%; border:0;}
  .area2 + h2 + .ptxt table th {width:20%; padding:1em 1.5em;  border-bottom:1px solid #7f7f7f; font-weight:600; vertical-align:top;}
  .area2 + h2 + .ptxt table td {padding:1em 1.5em; border-bottom:1px solid #7f7f7f;}
  .area2 + h2 + .ptxt table tr:last-child th,
	.area2 + h2 + .ptxt table tr:last-child td {border:0;}
  
  /* office */
  .office {margin:12% 0 0 0; background:linear-gradient(to right, #77bae8 50%, transparent 50%);}
  .office {margin:12% 0 0 0; background:linear-gradient(to right, #77bae8 50%, transparent 50%);}
  .office .inner {position:relative; display:flex; justify-content:space-between; width:100%; max-width:1320px; margin:0 auto; padding:0 3%; background:url(../images/profile_bg.jpg) left bottom no-repeat; background-size:50% auto; z-index:+1;}
  .office .inner .title {width:50%; 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:45%; 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;}
  
  iframe.gm {width:100%; height:30em; margin:2.5em 0 0 0;}
  
  main .btn {width:12em; margin:1.5em 0 0 0; font-size:90%;}
  main .btn a {position:relative; display:block; padding:0.3em 0; background:#327eae; color:#fff; text-align:center; transition:0.3s;}
  main .btn a:hover {opacity:0.8;}
  main .btn a::after {position:absolute; display:block; content:''; width:0.4em; height:0.4em; right:1.5em; top:40%; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(45deg);}

}

