body {margin:0; background: #fafafa; font-family: 'meiryo',sans-serif;}
a { text-decoration: none;}
img { vertical-align: bottom;}

header,article,nav,footer,main { position: relative; padding: 0 10%;}
article { margin-bottom: 20px;}

/*---------------------*/
header {background-image: linear-gradient(135deg, #F1EFFF 0%, #fff 75%, #F0F0F0 100%); height: 148px;
background-image: linear-gradient(75deg, #cecece 0%, #fff 17%, #fefefe 40%, #edebeb 70%, #dbddde 100%);}
.logo {height:135x; margin: 2px 0 0 -3px;}
h1 { font-size: 29px; color: #594232; line-height: 30px; letter-spacing: 1px; padding: 13px 0 51px 135px; margin: 0; text-shadow:3px 4px 5px rgba(100,70,10,0.20);}
header p { font-size: 20px; color: #FF835B; line-height: 28px; letter-spacing: -1px; padding: 10px 0 0 135px; margin: 0; text-shadow:3px 2px 4px rgba(100,70,10,0.17);}

/*--------MENU---------*/
menu { padding: 0; margin:0; position: absolute; top: 0; right: 10%; z-index: 2000; animation: fadeInmenu 1.5s ease 0s 1 normal;}
@keyframes fadeInmenu {
    0% { opacity: 0;}
    100% { opacity: 1;}
}

menu ul.linkmenu {display:table; position: absolute; width: 640px; top: 7px; right: 0; line-height: 25px; margin: 0; padding: 0; }
menu ul.linkmenu li {display: table-cell; vertical-align: top; padding: 0;}
menu ul.linkmenu li.r { padding: 0 0 0 40px; font-size: 14px; color:#6F6539;}
menu ul.linkmenu li a { display:inline-block; color: #5D4C00; font-size: 16px; line-height: 16px; vertical-align: bottom; margin: 2px 0 2px 0;}
menu ul.linkmenu li a img { height: 16px; margin: 0 9px 1px 1px;}
menu ul.linkmenu li a img.clb { height: 17px; margin: 0 8px 0 -1px;}
menu ul.linkmenu li a:hover { color: #FF4316;}
menu ul.linkmenu li button.inclose { display: none;}

div.icon { position: relative; margin: 12px 0 0 135px;}
div.icon span.tel, div.icon a.map, div.icon a.home { position: absolute;display: inline-block; color:#444; margin: 0; line-height: 20px; }
div.icon a:hover.map, div.icon a:hover.home { color: #EA3D09;}
div.icon span.tel { bottom: 9px; left: 0; font-size: 23px; color: #5B3628;font-weight: bold;}
div.icon span.tel img { height: 32px; margin: 0 10px -4px 0;}
div.icon a.map { bottom: 9px; left: 253px; font-size: 19px;}
div.icon a.map img { height: 28px; margin: 0 10px -1px 0;}
div.icon a.home { bottom: 13px; left: 582px; font-size: 16px;}
div.icon a.home img { height: 20px; margin: 0 8px 0 0;}
/*---iconlink---*/
.book { display: block; position: absolute;display: inline-block; color:#444; margin: 0; line-height: 20px;}
div.icon a.book { bottom: 9px; left: 590px; font-size: 19px;}
div.icon a.book:hover { color: #EA3D09;}
div.icon a.book img { height: 28px; margin: 0 10px -3px 0;}
/*--------MAIN---------*/

main { display: block; position: relative; height:500px;}
main div {width: 100%; position: absolute; left: 0; top: 0;height: 500px; background-size:cover;}

main div img.tr { position: absolute; top: 0; right: 10%; height: 500px;}
main div img.tl { position: absolute; top: 0; left: 10%; height:500px;}
main div img.tlg { position: absolute; top: 0; left: 10%; height:320px;}
main div img.trg { position: absolute; top: 0; right: 10%; height:320px;}

main div p { text-shadow:0 0 5px rgba(100,50,0,0.2); letter-spacing: 3px;}
main div p.l { position: absolute; top: 40px; left: 10%; height:320px; color: #FF5C00; font-size: 30px; max-width: 520px;}
main div p.l img.catch { margin: 0 -10px 5px 0; height:50px;}
main div span.l { display: inline-block; position: absolute; top: 200px; left: 10.4%; height:320px; color: #594200; font-size: 19px; font-weight: normal; max-width: 520px; line-height: 38px;}
main div p.r { display: inline-block; position: absolute; top: 40px; right: 11%; height:320px; color: #FF5C00; font-size: 30px; max-width: 450px;}
main div span.r { display: inline-block; position: absolute; top: 200px; right: 9.3%; height:320px; color: #472100; font-size: 19px; font-weight: normal; max-width: 450px; line-height: 38px; text-shadow: 1px 1px 2px #CCCCCC, 0 0 1em #fff, 0 0 0.2em #fff; }

div#p01 { animation: fadeIn1 33s ease 0s infinite normal;background-image: url('images/a01.jpg');}
@keyframes fadeIn1 {
    0%,20% { opacity:1;}
    31%,85% { opacity:0;}
    100%,100% { opacity:1;}
}
div#p01c { animation: fadeIn1c 33s ease 0s infinite normal;}
@keyframes fadeIn1c {
    0%,20% { opacity:0;}
    24%,28% { opacity:1;} 
    31%,100% { opacity:0;}
}

div#p02 { animation: fadeIn2 33s ease 0s infinite normal;background-image: url('images/a02.jpg');}
@keyframes fadeIn2 {
    0%,20% { opacity:0;}
    35%,49% { opacity:1;} 
    85%,100% { opacity:0;}
}
div#p02c { animation: fadeIn2c 33s ease 0s infinite normal;}
@keyframes fadeIn2c {
    0%,51% { opacity:0;}
    53%,58% { opacity:1;} 
    85%,100% { opacity:0;}
}
div#p03 {animation: fadeIn3 33s ease 0s infinite normal;}
@keyframes fadeIn3 {
    0%,51% { opacity:0;}
    66%,85% { opacity:1;}
    100%,100% { opacity:0;}
}
div#p03c {animation: fadeIn3c 33s ease 0s infinite normal;}
@keyframes fadeIn3c {
    0%,85% { opacity:0;}
    85%,92% { opacity:0.2;}
    93%,100% { opacity:0;}
}

/*--------banner---------*/
div.opening { font-size: 24px; font-weight:bold; margin: 30px 13%; padding: 35px 0;color:#fff; text-align: center;  border: 5px solid #fff; border-radius: 12px; letter-spacing: 4px; box-shadow:2px 4px 4px 3px rgba(100,70,10,0.22);background-image: linear-gradient(135deg, #FF9525 0%, #FF1F9A 70%, #FFA700 100%);}
h2.opening a { display: block;}
h2.opening a:hover {background-image: linear-gradient(to top, #cc208e 0%, #6713d2 100%);}

/*--------NAV---------*/
nav { margin-bottom: 20px;}
div.grid { display: grid; grid-template-columns: 40% 20% 20% 20%; max-width: 1400px;}
div.grid div { position: relative; margin: 0 10px 10px 0; padding-bottom: 10px; border: 1px solid #878200; box-shadow:2px 4px 4px 3px rgba(100,70,10,0.22); }
div.grid div.item1 { grid-column: 1; grid-row: 1 /3; overflow: hidden;}
div.grid div p { padding: 8px 4px; margin: 0; font-size: 17px; color:#6F5B00; text-align: center; background:#fff;}
div.grid div img { width: 100%; margin-bottom: 10px;}
div.grid div a { display: block;position: relative; margin: 0 8px 0 11px; line-height: 30px; color: #4F3409;}
div.grid div a span.triangle { position: absolute; top: 2px; right: 5px; padding: 0; margin: 0; width:0;height:0;border-style:solid;border-width: 8px 0 8px 12px;border-color: transparent transparent transparent #F96D50;}
div.grid div a:hover {color: crimson;}
div.grid div a:hover span.triangle { border-color: transparent transparent transparent #71B30F;}

/*--------DIV HEADING---------*/
div.heading {height: 420px; overflow: hidden; position: relative; background-size:cover; background-position: top right;}
div.backall { background-position: top right;}
div.heading img.tl { position: absolute; top: 0; left: 10%; width:590px;}
div.heading img.tr { position: absolute; top: 0; right: 10%; width:590px;}
div.heading img.trr { position: absolute; top: 0; right: 10%; width:690px;}
div.heading img.tr1 { position: absolute; top: 0; right: 14%; width:590px;}
div.heading img.bl { position: absolute; bottom: 0; left: 10%; width:590px;}
div.heading img.br { position: absolute; bottom: 0; right: 10%; width: 610px;}
/*---*/
div.i-inside { padding:38px 0 0 10%;}
div.i-inside p { position: relative; color: #F37739; font-size: 25px; font-weight: bold; line-height: 32px; vertical-align: top; padding: 5px 0 20px 0.5%;}
div.i-inside span { display: block; position: relative; color: #4a4a4a; font-size: 18px; line-height: 24px; vertical-align: top; padding: 24px 0 0 1.8%;}

div.i-r p,div.i-r span { padding-left:590px;}
div.i-inside p img { float: left; width: 65px; margin: -4px 35px 0 0;}
div.i-inside span img { float: left; width: 18px; margin: 1px 28px 0 0;}

/*--------FEATURE----------*/
h2.feature-title {color: #E87571; font-size: 24px; font-weight:normal; line-height: 27px; padding: 22px 0 13px 0; margin-bottom: 25px; border-bottom: 3px dotted #E8D9F7;}
img.no {width:37px;margin: 0 18px 35px 0;}
div.feature { display: grid; width:100%; grid-template-columns: 370px 1fr 360px;}
div.feature div { position: relative;}
div.feature h3.no01,div.feature h3.no03,div.feature h3.no05,div.feature h3.no07 { font-size: 20px; color: #FF9999; margin: 0; padding: 0 30px; font-weight: bold; position:relative;}
div.feature h3.no01 img,div.feature h3.no03 img,div.feature h3.no05 img,div.feature h3.no07 img { width: 25px; position: absolute; top: 4px; left: 0; }
div.feature div.no02,div.feature div.no04,div.feature div.no06,div.feature div.no08 { font-size: 16px; color:#666666; padding: 0 30px 0 0;}
div.feature div.photo {grid-column: 3; grid-row: 1 / 5; text-align:right;}
div.feature div.photo img { margin-bottom:20px; width:250px;}
div.feature div.photo img.feature { width:100%;}

/*--------UL LAY----------*/
ul.lay { display:table; padding:0; margin: 0; width: 100%;}

ul.lay li { display: table-cell; padding:0; vertical-align: top; padding: 0 0 0 18px;}
ul.lay li h2 { display: block; padding: 14px 18px 14px 28px; margin: 21px 0 5px -28px; color: #FF826B; font-size: 24px; font-weight:normal; line-height: 27px; background-image: linear-gradient(180deg, #eee 0%, transparent 100%);}
ul.lay li h3 { padding: 0; margin: 12px 20px 0 0; color:#776A00; font-size: 19px; line-height: 30px; font-weight: normal;}
ul.lay li h3 b { display: block; line-height: 28px; margin-bottom:5px; opacity:0.6; font-size: 20px; }
ul.lay li span { display: block; padding: 0; margin: 12px 25px 0 0; color: #666666; color: #68623E; font-size: 16px; line-height: 25px;}
ul.lay li span b { display: inline-block; opacity:0.85; font-size: 17px; }

ul.lay li.l { width: 350px; padding: 0 40px 0 0;}
ul.lay li.l img { width: 100%; margin-top: 20px;}
ul.lay li.l img.middle { width: 75%; margin-top: 20px;}
ul.lay li img.small { float: right; width: 240px; margin: 3px 0 12px 30px;}
ul.lay li img.pc {}
/*---*/
ul.lay li span.r100 { text-align: center;}
ul.lay li span span.flow { display: block; border: 1px solid grey; padding: 15px; margin: 18px 0; font-weight: normal; background: #F9FFFB;}
ul.lay li.r50 { width: 40%; padding: 0 5%; text-align: center;}
ul.lay li.r50 span span { display: block; border: 1px solid grey; padding: 15px; margin: 18px 0; font-weight: normal;}
ul.lay li.pink span span { background: #FFF4FB;}
ul.lay li.violet span span { background: #F5F4FF;}

/*--------BUTTON----------*/
button#open-id,button#close-id { color: #8F7A48; font-size: 16px; width: 98%; padding: 5px 0; margin-bottom: 35px; border: none; cursor: pointer;background-image: linear-gradient(180deg, transparent 0%, transparent 50%, #E6DEC7 100%); border-radius: 7px;}
button:hover#open-id,button:hover#close-id { background: #fff; color: #E6837E;}

/*---------SECTION-------------*/

div.caselink {
position: relative; width: 100%; height: 30px; margin: -31px 0 40px 0;
}
div.caselink button.link {
width: 200px; 
padding: 0;
margin: 0;
border: 1px solid #EF6D71;
position: absolute; 
top: 0; 
z-index: 1000;
overflow: hidden;
}
div.caselink button.child { left: 0; border-radius: 8px 0 0 8px;}
div.caselink button.grownup { left: 199px;}
div.caselink button.partial { left: 398px; border-radius: 0 8px 8px 0;}
div.caselink button.link p { color: #C30D09;font-size: 17px; line-height: 22px;background: #fff; padding: 8px 0 5px 0; margin: 0;}
div.caselink button.link span {
animation: fadeInmenu 1.5s ease 0s 1 normal;
display: none;
width: 100%; 
padding: 0;
margin: 0;
border: none;
}
div.caselink button.link span a { display: block; width: 100%; background: #E40D09; color: #fff; font-size: 16px; padding: 8px 0; margin: 0; text-align: center; border-top: 1px solid #fff;}

/*----------*/
section.case {display: block; position: relative; margin:0; padding:45px 10%; background-position: top center;}
section.case h2 { position: relative; color: #898235; font-size: 20px; line-height: 33px; vertical-align: top; margin: 0 0 15px 2px;}
section.case h2 img { float: left; width: 65px; margin: 2px 17px 0 0;}

section.case ul { display: table; margin: 0; padding: 14px 0 12px 0;}
section.case ul li {display:table-cell; padding: 0 12px 0 0; vertical-align: top;}
section.case ul li img {width: 300px; margin-right: 20px; border: 4px solid #fff; box-shadow:3px 5px 5px 4px rgba(100,70,10,0.22);}
section.case ul li span.case-t { display: block; font-size: 18px; color: #726535;line-height: 38px; margin: 12px 0 22px 50px;}
section.case ul li span.case-t img { width: 19px; margin: 0 15px 0 0;}

section.case div.wrapper { display: grid; grid-template-columns: 400px 400px;}
section.case div.wrapper div { position: relative; padding: 0 20px 0 0;}
section.case div.wrapper div img.plus { z-index: 99; width: 15px; position: absolute; bottom: 20px; right:30px; box-shadow:none;}
section.case div.wrapper div a img { width: 100%; border: 1px solid #878200; box-shadow:2px 4px 4px 3px rgba(100,70,10,0.22);}
section.case div.wrapper div a:hover img { box-shadow: none;}

section.case div.wrapper div.box1 { grid-column: 1; grid-row: 1 /3;}

section.case span.case-st { display: block; font-size: 18px; color: #726535; padding: 10px 0 20px 0; line-height: 18px;}
section.case span.case-st img { width: 19px; margin: 0 15px 0 0;}

section.case hr.case { border-width: 4px 0 0 0; border-color: #FF905B; border-style: dotted; margin: 30px 0;}


  /*---
  div.caselink a { display: inline-block; margin: 0 5px 0 0; padding: 5px 7px 3px 5px; background: #eee; color: #444; font-size: 16px; line-height:16px; border-radius: 5px;}
  div.caselink a.col1 { background: #333; color: #fff; cursor: auto;}
  div.caselink a:hover.col1 { background: #333; color: #fff;}
  div.caselink a:hover { background: crimson; color:#fff;}
  --*/
/*----------FEE------------*/

div.wrapfee { display: grid; width:95%; grid-template-columns: 25% 58% 17%; border-width: 1px 1px 0 0; border-color:#444; border-style: solid; color:#584809;}
div.wrapfee div { position: relative; padding: 5px 8px; border-width: 0 0 1px 1px; border-color:#444; border-style: solid;}
div.wrapfee div.fee { text-align: right;}
div.wrapfee div.w00 { grid-column: 1/4; background: #F7F7EA;}
div.wrapfee div.w10 { grid-column: 1/3; background: #fff;}
div.wrapfee div.w20 { grid-column: 1/3; background: #fff;}
div.wrapfee div.w30 { grid-column: 1/3; background: #fff;}
div.wrapfee div.w40 { grid-column: 1; grid-row: 5 / 9; background: #fff;}
div.wrapfee div.w50 {}
div.wrapfee div.w60 {}
div.wrapfee div.w70 {}
div.wrapfee div.w80 {}
div.wrapfee div.w90 { grid-column: 1; grid-row: 9 / 11; background:#fff;}
div.wrapfee div.w100 {}
div.wrapfee div.w101 {}
div.wrapfee div.w102 { grid-column: 1; grid-row: 11 / 13; background:#fff;}
div.wrapfee div.w103 {}
div.wrapfee div.w104 {}
div.wrapfee div.w105 { grid-column: 1; grid-row: 13 / 17; background:#fff;}
div.wrapfee div.w106 { grid-column:2/4;}
div.wrapfee div.w107 { grid-column:2/4;}
div.wrapfee div.w108 { grid-column:2/4;}

/*-------------*/
hr { border-width: 1px 0 0 0; border-color: #bbb; border-style: solid; margin: 0;}
article hr { border-width: 1px 0 0 0; border-color: #bbb; border-style: solid; margin: 20px 0;}

footer { padding:30px 0 45px 0; color:#726535; font-size; 13px; text-align: center; border-top:1px solid #578935;}

/*---- kodomo ------*/

a.hanarabi { display: inline-block; padding: 5px 10px 15px 0;}
a.hanarabi img { width: 155px;}
a.hanarabi img.plus { width: 12px;}

/*---Book---*/
ul.book1 { display: table;width:70%; margin: 10px 15% 40px 15%; padding: 0;position: relative; height: auto;}
ul.book1 li.left {
display: table-cell;
text-align: center;
min-width: 400px;
padding: 5px; 
border-color:#FF7ABA; 
border-width: 1px 1px 1px 1px; 
border-style: solid;
border-radius: 8px;
overflow: hidden;
}
ul.book1 li.left img { width: 90%; min-width:770px;}

/*---BOOK---*/
ul.book { 
display: table; 
padding: 0;
position: relative; 
height: auto;background-image: linear-gradient(125deg, #FFCEEE 0%, #FFF7FF 22%, #fff 45%, #FFEAEC 70%,#FFCEEE 100%);
border-color:#FFCDD0; 
border-width: 5px; 
border-style: solid;
border-radius: 12px;
overflow: hidden;
box-shadow:1px 1px 7px 2px rgba(100,50,0,0.2);
}
ul.book li.left {
display: table-cell; 
padding: 0; 
}
ul.book li.left img { width: 100%;}

ul.book li.right{
display: table-cell; 
padding: 10px 10px 0 3%; 
vertical-align: top;
}

ul.book li.right p{ display: inline-block; margin: 8px 0 13px -12px; padding: 7px 22px 5px 15px; font-size: 22px; line-height: 25px; font-weight: bold; color:#FF3425; background: #FFFFC7; border-radius:8px; box-shadow:1px 0 5px 3px rgba(150,0,100,0.1);}
ul.book li.right p img { height: 25px; margin: 0 14px 1px 0;}
ul.book li.right span {display: block; margin: 0; padding: 5px 1px; font-size: 16px; line-height: 20px; color: #5D4BA6; border-bottom:2px dotted rgba(255,100,220,0.2);}
ul.book li.right span img { height: 18px; margin: 0 15px 2px 0;}
ul.book li.right span a { color:#EF311F; font-weight: bold;}

ul.mobile { display:none;}

/*--- GENERAL CLINIC ---*/
.i06 { position: absolute; top: 155px; left: 10.5%; z-index: 199; height: 210px;}

ul.general { display: table; color: #4F310E; padding: 0; margin: 25px 0 0 0;}
.w100 { width: 100%;}
ul.general li { display: table-cell; padding: 0; vertical-align: top;}
ul.general li p { color: #F84F0E; font-size: 20px; margin:0 0 12px 0; padding: 0;}

ul.general li.side1 { width: 41%;}
ul.general li img.exterior { width: 100%; max-width: 580px;}
ul.general li.side2 { width:59%; text-shadow: 1px 1px 5px rgba(10,40,100,0.25);}
ul.general li.side2 p { color: #fff; font-size: 23px; font-weight: bold; text-shadow:1px 1px 5px rgba(20,30,120,0.45); margin:0 0 0 22px; padding: 8px 10px 19px 13px; background-image: linear-gradient(180deg, #FFC5D5 0%, #FFDDEE 57%,#Fafafa 100%);}
ul.general li.side2 span { display:block; font-size:17px; margin: 10px 0 8px 40px; line-height: 24px;}
ul.general li.side2 aside { display:inline-block; width: 80px; color: #239D95;}
ul.general li span.explain { display: block; padding: 45px 10px 0 40px; margin: 0;}
ul.general li i { margin: 0 17px 20px 0; color: #FF5993;}

ul.general li aside { margin: -20px 0 0 0;}
ul.general li div.timetable { margin: 10px 0;}
ul.general li span.timenote { display: block; margin: 50px 0 0 30px;}
ul.general li.time-t {}

ul.general li.news1 {width: 35%;}
ul.general li.news2 {width: 65%;}

div.equip { display:grid; grid-template-columns:1fr 1fr 1fr; margin: 25px 0; width: 100%; max-width:1400px;}
div.equip div {margin: 5px; padding: 10px 15px; text-shadow: 1px 1px 5px rgba(10,40,100,0.25); border: 1px solid #DBE4FF; background-image: linear-gradient(180deg, #F1F1FF 0%, #fff 80%, #fff 100%);}
div.equip div img { width: 100%;}
div.equip div h2 { color: #6E7B7E; font-size: 17px; font-weight: normal; text-align: center; padding: 0 ; margin: 0 0 7px 0;}
div.equip div h3 { color: #555; font-size: 15px; font-weight: normal; margin: 20px 10px 10px 10px;}
div.equip div span { display: block; color: #FF6699; font-size: 14px; margin: 0 0 5px 0;text-align: center; }
div.equip div i {color: #FF7A62; margin: 0 15px 0 0;}

h5 { margin: 0; padding: 0; color:#57AAD4; font-size: 20px;}
div.clinic { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; margin: 25px 0; }
div.clinic div {margin: 5px; padding: 10px 15px; background: #fff; border: 1px solid #C4AB42; background-image: linear-gradient(180deg, #F8f2E7 0%, #fff 100%); text-shadow: 1px 1px 5px rgba(100,10,50,0.25);}
div.clinic div img { width: 100%;}
div.clinic div h2 { color: #61421A; font-size: 17px; font-weight: normal; text-align: center; padding: 0 ; margin: 2px 0 0 0;}
div.clinic div h3 { color: #64441D; font-size: 15px; font-weight: normal; margin: 20px 10px 10px 10px;}
div.clinic div span { display: block; color: #F39575; font-size: 14px; margin: 0 0 5px 0;text-align: center; }
div.clinic div i {color: #FF4C48; margin: 0 15px 0 0;}

div.instruct { display:grid; grid-template-columns:1.25fr 2fr; margin: 25px 0;}
div.instruct div {margin: 5px; padding: 10px 15px; color: #715B39; font-size: 15px; background: #fff; border: 1px solid #C4AB42;}
div.instruct div img { width: 100%;}
div.instruct div h2 { color: #916B28; font-size: 17px; font-weight: normal; text-align: left; padding: 0 ; margin: 2px 0 0 0;}
div.instruct div h3 { color: #715B39; font-size: 15px; font-weight: normal; margin: 20px 10px 10px 10px;}
div.instruct div span { display: block; color: #FF6699; font-size: 14px; margin: 0 0 5px 0;text-align: left; }
div.instruct div i {color: #FF7A62; margin: 5px 12px 0 0;}

/*---@media---*/
@media screen and (min-width:400px) and (max-width: 1100px) {
header,article,nav,footer,main { padding: 0 2%;}
.logo {height:100px; top:7px;left:0.5%;}
header h1 { letter-spacing: -1px; font-size:24px; position: absolute; top: 40px; left: 0.4%;}
header p { letter-spacing: -1px; font-size:17px; position: absolute; top: 10px; left: 0.4%;}
div.icon { position: relative; margin: 45px 0 0 0.5%;}

menu {right: 0.5%;}
menu ul.linkmenu { width: 470px;}
menu ul.linkmenu li.r { padding: 0 0 0 5px;}

main div { background-position: top right;}
main div img.tr { right: 1%;}
main div img.tl { left: 1%;}
main div img.tlg { left: 1%;}
main div img.trg { right: 1%;}
main div p.l { left: 2%;}
main div span.l { left: 2%;}
main div p.r { right: 2%;}
main div span.r { right: 2%;}

div.heading img.tl { position: absolute; top: 0; left: 1%; width:590px;}
div.heading img.tr { position: absolute; top: 0; right: 1%; width:590px;}
div.heading img.trr { position: absolute; top: 0; right: 1%; width:690px;}
div.heading img.tr1 { position: absolute; top: 0; right: 1%; width:590px;}
div.heading img.bl { position: absolute; bottom: 0; left: 1%; width:590px;}
div.heading img.br { position: absolute; bottom: 0; right: 1%; width: 610px;}
div.i-inside { padding:38px 0 0 1%;}

ul.book {width:98%; margin: 10px 1% 40px 1%;}
ul.book li.left {width: 40%; min-width: 400px;}

section.case { padding:45px 2%;}
section.case ul { display: table; margin: 0; padding: 14px 0 12px 0;}
section.case ul li {display:table-cell; padding: 0 5px; vertical-align: top;}
section.case ul li img {width: 250px; margin-right: 0; border: 4px solid #fff; box-shadow:3px 5px 5px 4px rgba(100,70,10,0.22);}
section.case ul li span.case-t { display: block; font-size: 18px; color: #726535;line-height: 38px; margin: 1px 0 22px 0px;}
section.case ul li span.case-t img { width: 19px; margin: 0 15px 0 0;}

.i06 {left: 20px;}

/*----ヘッド写真----*/
img.head-photo { position: absolute; top: 35px; left: 0; width: 500px;}
}

/*---@media---*/
@media screen and (min-width:1100px) and (max-width:1920px) {
header,article,nav,footer,main { min-width: 1100px;}
.logo {height:130px; position:absolute; top:7px;left:9%;}
main div { background-position: top left;}
ul.book {width:70%; margin: 40px 15% 40px 15%;}
ul.book li.left {width: 35%; min-width: 420px;}
section.case ul { min-width: 1100px;}
/*----ヘッド写真----*/
img.head-photo { position: absolute; top: 25px; left: 8.8%; width: 40%;}
}