@charset "UTF-8";



section.case{
margin:3em 1em;
padding:0 1em 1em !important;
border:#CCCCCC solid 1px;
border-radius:6px;
-webkit-border-radius:6px;
-moz-border-radius:6px;
}



section#c01{
background-color:rgba(147,209,16,0.1);
}

section#c02{
background-color:rgba(23,136,204,0.1);
}

section#c03{
background-color:rgba(20,184,197,0.1);
}

section#c04{
background-color:rgba(217,163,0,0.1);
}

section#c05{
background-color:rgba(217,217,0,0.1);
}

section#c06{
background-color:rgba(217,142,227,0.1);
}

section#c07{
background-color:rgba(255,162,208,0.1);
}

section.case h3{
border-bottom:none !important;
}


#all h3{
padding:0.2em 0.2em 0.2em 2em ;
}


#all h3:before{
position:absolute;
left:1%;
top:18%;
content:'\f138';
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
font-size:18px;
color:#FFF;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}




section.case h3{
position:relative;
border:dashed 2px white !important;
margin:2em 0.5em 0.5em;
padding:0.2em 0.5em 0.5em 0.5em;
font-size:150%;
color:#444444;
font-weight:700;
}

section.case h3:after{
position:absolute;
content:'';
left:-7px;
top:-7px;
border-width:0 0 15px 15px;
border-style:solid;

box-shadow:1px 1px 1px rgba(0, 0, 0, 0.15);
}




/*　------------------　*/

section#c01 h3{
background: rgba(147,209,16,0.5);
box-shadow: 0px 0px 0px 5px rgba(147,209,16,0.5);
}

section#c01 h3:after{
border-color: #fff #fff rgba(147,209,16,1);
}




/*　------------------　*/

section#c02 h3{
background: rgba(23,136,204,0.5);
box-shadow: 0px 0px 0px 5px rgba(23,136,204,0.5);
}

section#c02 h3:after{
border-color: #fff #fff rgba(23,136,204,1);
}



/*　------------------　*/

section#c03 h3{
background: rgba(20,184,197,0.5);
box-shadow: 0px 0px 0px 5px rgba(20,184,197,0.5);
}

section#c03 h3:after{
border-color: #fff #fff rgba(20,184,197,1);
}



/*　------------------　*/

section#c04 h3{
background: rgba(217,163,0,0.5);
box-shadow: 0px 0px 0px 5px rgba(217,163,0,0.5);
}

section#c04 h3:after{
border-color: #fff #fff rgba(217,163,0,1);
}


/*　------------------　*/

section#c05 h3{
background: rgba(217,217,0,0.5);
box-shadow: 0px 0px 0px 5px rgba(217,217,0,0.5);
}

section#c05 h3:after{
border-color: #fff #fff rgba(217,217,0,1);
}



/*　------------------　*/

section#c06 h3{
background: rgba(217,142,227,0.5);
box-shadow: 0px 0px 0px 5px rgba(217,142,227,0.5);
}

section#c06 h3:after{
border-color: #fff #fff rgba(217,142,227,1);
}










figure{
margin:1em auto;
}

figure img{
border:#CCC solid 1px;
}

figcaption{
padding:0.5em;
}


/* .photo-col
------------------------------- */
.photo-col{
margin:1em auto;
text-align:center;
}

.photo-col figure{
max-width:100%;
height:auto;
margin:3%;
}


hr{
margin:2em auto;
max-width:120%;
height:2px;
border:0;
background:linear-gradient(left, #FFF, #FFA800 ,#FFF);
background:-webkit-linear-gradient(left, #FFF, #FFA800 ,#FFF);
background:-moz-linear-gradient(left, #FFF, #FFA800 ,#FFF);
}


/* ページ内メニュー
---------------------------------*/
.topmenu-buddy{
margin:1em auto;
padding:0.5em;
background-color:#FFF;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border:#CCC solid 1px;
background-color:#FEFBF3;
}

.topmenu-buddy ul{
margin:0 0 0 -1em;
padding:0;
font-size:120%;
line-height:1.2;
list-style:none;
}

.topmenu-buddy ul li{
text-align:left;
padding:0;
}

.topmenu-buddy ul li a{
display:block;
padding:10px 10px 10px 1.5em;
color:#000;
text-decoration:none;
text-indent:-0.6em;
margin-left:1em;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
}

.topmenu-buddy ul li a:before {
display:inline-block;
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
font-size:120%;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
content:"\f0ab";
margin-right:5px;
color:#36C;
}

.topmenu-buddy ul li a:hover{
background-color:#36C;
color:#FFF;
}

.topmenu-buddy ul li a:hover:before{
display:inline-block;
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
font-size:120%;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
content:"\f0ab";
margin-right:5px;
color:#FF0;
}

.topmenu-buddy ul li a span{
font-weight:700;
}




@media all and (min-width:700px) {


/* .photo-col
------------------------------- */
.photo-col{
display:flex;
justify-content:center;
}

.photo-col figure{
flex:1;
max-width:700px;
height:auto;
}

.photo-col .p2 figure{
flex:1;
max-width:360px;
height:auto;
}


}