@charset "utf-8";


/*-------------------------
	Common Layout
-------------------------*/
@import "family.css";


/*-------------------------
	Visual Layout
-------------------------*/
#visual {
		height: 295px;
}

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

#visual {
		height: 140px;
		position: relative;
}


}

/*-------------------------
	Content Layout
-------------------------*/

/*== LeftBox ==*/
#content div.lb {
		width: 180px;
		padding: 0px 40px 0px 0px;
}


/*== RightBox ==*/
#content div.rb {
		width: 430px;
}


/*== ClearBox - PTL LIST1 ==*/
#content div.cb div.ptl.circle {
		padding: 0px 40px;
}
#content div.cb div.ptl.circle div {
		padding: 0px 15px;
}


/*== ClearBox - PTL LIST2 ==*/
#content div.cb div.ptl.detail {
		margin-bottom: 30px;
}
#content div.cb div.ptl.detail div.data {
		width: 460px;
}
#content div.cb div.ptl.detail p {
		margin-bottom: 0px;
		padding-bottom: 0px;
}

/*== ClearBox - PTL LIST3 ==*/
#content div.cb div.ptl.lb {
		width: 300px;
		margin: 0px 20px 20px 0px;
		padding: 0px;
}
#content div.cb div.ptl.lb div {
		width: 150px;
		vertical-align: bottom;
}


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

#content img {
    width: 70%;
}

#content div.rb {
    width: 100%;
}

#content p {
    margin: 10px;
}

#content h3 {
    height: 20px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: solid 1px #222;
    font-size: 18px;
    font-weight: bold;
}

#content h3 img {
    width: 45%;
}


#content h4 {
    padding-bottom: 10px;
    font-size: 17px;
    font-weight: bold;
    color: #5F4637;
}

#content h5 img {
    width: 11%;
}

#content h5.big_h5 img {
    width: 15%;
}


#content div.cb div.ptl.circle {
padding: 0px 20px;
}

#content div.cb div.ptl.circle img {
    width: 100%;
}

#content div.cb div.ptl.circle div {
    padding: 0px;
}



#content div.sb {
    padding: 20px 0 0 0px;
}

#content div.cb div.ptl.detail {
    margin-bottom: 30px;
    margin-left: 30px;
}

#content div.cb div.ptl.detail img {
    width: 100%;
}

.sb.left-margin {
    margin-left: 30px;
}


#content p.lead {
    width: 50%;
}

}



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

#content div.rb {
    width: 100%;
}

#content h3 img {
    width: 85%;
}


#content h4 {
    padding-bottom: 10px;
    font-size: 17px;
    font-weight: bold;
    color: #5F4637;
}

#content h5 img {
    width: 21%;
}

#content h5.big_h5 img {
    width: 30%;
}


#content div.cb div.ptl.circle img {
    padding: 0 0 0 5px;
	width: 90%;
}

#content div.cb div.ptl.detail div.data {
    width: 65%;
}

.sb.left-margin {
    margin-left: 50px;
}

}