210723開発ログ

151691 ワード
テキストリンク
1)学習内容
국내외 사이트 카피캣 (네이버 웹툰 1편)

> 상단영역
<header id="webtoon-header">
		
<div class="webtoon-header-top">
<div class="webtoon-container">
<div class="webtoon-header-left">
<h2><a href="#">만화</a></h2>
<em class="bar"></em>
<h3><a href="#">웹소설</a></h3>

<div class="webtoon-header-input-wrap">
<input type="text">
<button type="button" class="btn-search"></button>
</div>
</div>
                
<div class="webtoon-header-right">
<a href="#" class="btn-login">로그인</a>
<button type="button" class="btn-menu"></button>
</div>
</div>
</div>

<div class="webtoon-header-nav">
<div class="webtoon-container">
<nav>
<ul>
<li class="on"><a href="webtoon.html">홈</a></li>
<li><a href="webtoon-detail.html">웹툰</a></li>
<li><a href="#">베스트 도전</a></li>
<li><a href="#">도전만화</a></li>
</ul>
</nav>

<div class="webtoon-header-link-wrap">
<i class="icon-ex-mark"></i>
<a href="#">온천마을 판타지 로맨스 <모락모락 왕세자님></a>
</div>
</div>
</div>

</header>

.webtoon-border {border: solid 1px #ced2d7;}

.webtoon-container 
	{width: 960px;
	margin: 0 auto;}

#webtoon-header {background-color: #ffffff;}

#webtoon-header .webtoon-header-top 
	{background-color: #ffffff;
	border-bottom: solid 1px #f2f2f2;

	padding: 10px 0 8px 0;}

#webtoon-header .webtoon-header-top .webtoon-container 		
	{display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;}

#webtoon-header .webtoon-header-top .webtoon-header-left 	
	{display: flex;
	flex-wrap: wrap;
	align-items: center;

	width: 550px;}

#webtoon-header .webtoon-header-top .webtoon-header-left h2 {font-size: 20px;}

#webtoon-header .webtoon-header-top .webtoon-header-left .bar 
	{width: 1px;
	height: 13px;
	background-color: #d2d2d2;

	margin-left: 8px;
	margin-right: 10px;}

#webtoon-header .webtoon-header-top .webtoon-header-left h3 {margin-right: 30px;

	font-size: 16px;}

#webtoon-header .webtoon-header-top .webtoon-header-left h3 a {color: grey;}

#webtoon-header .webtoon-header-top .webtoon-header-input-wrap 
	{display: flex;
	flex-wrap: wrap;
	align-items: center;

	width: 315px;
	height: 37px;
	border: solid 1px #e5e5e5;}

#webtoon-header .webtoon-header-top .webtoon-header-input-wrap input 
	{width: calc(100% - 35px);
	height: 100%;
	border: none;

	padding: 0 10px;}

#webtoon-header .webtoon-header-top .webtoon-header-input-wrap input:focus 
	{outline: none;}

#webtoon-header .webtoon-header-top .webtoon-header-input-wrap .btn-search 
	{width: 35px;
	height: 100%;
	background-color: #00d564;}

#webtoon-header .webtoon-header-top .webtoon-header-right 	
{display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;}

#webtoon-header .webtoon-header-top .webtoon-header-right .btn-login 
	{border: solid 1px #000000;
	
	padding: 2px 4px;
	margin-right: 20px;
	
	font-size: 12px;}

#webtoon-header .webtoon-header-top .webtoon-header-right .btn-menu 
	{width: 16px;
	height: 16px;
	background-color: blue;}

#webtoon-header .webtoon-header-nav 
	{border-bottom: solid 1px #e5e5e5;}

#webtoon-header .webtoon-header-nav .webtoon-container 	
	{display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;}

#webtoon-header .webtoon-header-nav nav {}

#webtoon-header .webtoon-header-nav nav ul 
	{display: flex;
	flex-wrap: wrap;
	align-items: center;}

#webtoon-header .webtoon-header-nav nav ul li 
	{width: auto;
	height: 40px;}

#webtoon-header .webtoon-header-nav nav ul li.on a {
	background-color: #00d564;
	color: #ffffff;}

#webtoon-header .webtoon-header-nav nav ul li a 		
	{display: block;
	width: 100%;
	height: 100%;
	padding: 0 15px;

	line-height: 40px;

	font-size: 14px;}

#webtoon-header .webtoon-header-nav .webtoon-header-link-wrap {}

#webtoon-header .webtoon-header-nav .webtoon-header-link-wrap .icon-ex-mark
	{display: inline-block;
	width: 16px;
	height: 14px;
	background-color: #000000;	

	vertical-align: middle;}

#webtoon-header .webtoon-header-nav .webtoon-header-link-wrap a 
	{vertical-align: middle;
	font-size: 12px;
	color: #606060;}

#webtoon-header .webtoon-header-nav .webtoon-header-link-wrap a:hover {text-decoration: underline;}
> 메인 왼쪽
<main role="main" id="webtoon-main">
		
<div class="webtoon-container">
			
<div class="webtoon-main-left">
				
<div class="webtoon-carousel webtoon-border">
					
<div class="webtoon-carousel-left">
<h2>오늘의<br><span>웹툰</span></h2>
<p>5월 19일 수요일</p>
<ul>
<li class="on"><a href="#">인기순</a></li>
<li><a href="#">업데이트순</a></li>
<li><a href="#">조회순</a></li>
<li><a href="#">별점순</a></li>
</ul>
</div>

<div class="webtoon-carousel-right">
						
<div class="webtoon-carousel-banner">
<img src="https://via.placeholder.com/582x195">
</div>

<div class="webtoon-carousel-banner-nav">
							
<ul>
<li><img src="https://via.placeholder.com/135x57"></li>
<li><img src="https://via.placeholder.com/135x57"></li>
<li><img src="https://via.placeholder.com/135x57"></li>
<li><img src="https://via.placeholder.com/135x57"></li>
</ul>

<a href="#" class="btn btn-prev"></a>
<a href="#" class="btn btn-next"></a>
</div>
					
</div>
</div>

#webtoon-main 
	{padding-bottom: 100px;}

#webtoon-main .webtoon-container 
	{overflow: hidden;}

#webtoon-main .webtoon-main-left 
	{float: left;

	width: 694px;
	height: 2000px;
	background-color: yellow;}

#webtoon-main .webtoon-main-left .webtoon-carousel 
	{overflow: hidden;
	width: 694px;
	height: 252px;
	background-color: #ffffff;

	margin-bottom: 20px;}

#webtoon-main .webtoon-main-left .webtoon-carousel .webtoon-carousel-left 
	{float: left;
	width: 112px;
	padding: 20px 5px 0 15px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left h2 
	{font-size: 25px
	margin-bottom: 13px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left span 
	{color: #00d564;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left p 	{font-size: 12px;
	color: #808285;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left ul {margin-top: 48px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left li 
	{font-size: 12px;
	margin-bottom: 10px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left li.on a 
	{color: #00d564;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left li:last-child 
	{margin-bottom: 0;}

#webtoon-main .webtoon-main-left .webtoon-carousel .webtoon-carousel-right 
	{float: right;
	width: calc(100% - 112px);}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner 
	{width: 582px;
	height: 195px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner img 
	{width: 100%;
	height: 100%;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav 
	{position: relative;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul 
	{display: flex;
	flex-wrap: wrap;
	align-items: center;

	width: 540px;
	margin: 0 auto;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul li 
	{width: 135px;
	height: 57px;
	border-left: solid 1px #e5e5e5;
	border-right: solid 1px #e5e5e5;}


#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul li:fist-child 
	{border-left: none;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul li:last-child 
	{border-right: none;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul li img 
	{width: 100%;
	height: 100%;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav .btn 
	{position: absolute;
	width: 20px;
	height: 57px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav .btn.btn-prev 
	{left: 0;
	top: 0;
	background-color: pink;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav .btn.btn-next 
	{right: 0;
	top: 0;	
	background-color: blue;}
> 메인 왼쪽2
<div class="webtoon-banner"></div>


<div class="webtoon-content">
<div class="webtoon-content-header webtoon-content-header-recommend">
<h2>장르별 <span>추천웹툰</span></h2>

<nav>
<ul>
<li class="on"><a href="#">에피소드</a></li>
<li><a href="#">옴니버스</a></li>
<li><a href="#">스토리</a></li>
</ul>
</nav>
</div>


<div class="webtoon-content-body">
<nav>
<ul>
<li><a href="#">인기순</a></li>
<li><a href="#">업데이트순</a></li>
<li><a href="#">조회순</a></li>
<li><a href="#">별점순</a></li>
</ul>
</nav>

<ul class="webtoon-content-col-3">
							
<li class="webtoon-content-col-type-1">
<img src="https://via.placeholder.com/210x120">
<div class="webtoon-content-col-3-info">
<h4>기억의 흔적</h4>
<p>60화</p>
<span>브라보 장</span>
</div>
</li>
                            
<li class="webtoon-content-col-type-1">
<img src="https://via.placeholder.com/210x120">
<div class="webtoon-content-col-3-info">
<h4>기억의 흔적</h4>
<p>60화</p>
<span>브라보 장</span>
</div>
</li>
<li class="webtoon-content-col-type-1">
<img src="https://via.placeholder.com/210x120">
<div class="webtoon-content-col-3-info">
<h4>기억의 흔적</h4>
<p>60화</p>
<span>브라보 장</span>
</div>
</li>

<li class="webtoon-content-col-type-1">
<img src="https://via.placeholder.com/210x120">
<div class="webtoon-content-col-3-info">
<h4>기억의 흔적</h4>
<p>60화</p>
<span>브라보 장</span>
</div>
</li>
<li class="webtoon-content-col-type-1">
<img src="https://via.placeholder.com/210x120">
<div class="webtoon-content-col-3-info">
<h4>기억의 흔적</h4>
<p>60화</p>
<span>브라보 장</span>
</div>
</li>
<li class="webtoon-content-col-type-1">
<img src="https://via.placeholder.com/210x120">
<div class="webtoon-content-col-3-info">
<h4>기억의 흔적</h4>
<p>60화</p>
<span>브라보 장</span>
</div>
</li>
</ul>
</div>
</div>


<div class="webtoon-content">
<div class="webtoon-content-header">
<h2>베스트 도전 <span>추천웹툰</span></h2>
</div>

<div class="webtoon-content-body">
						
<ul class="webtoon-content-col-3">
<li class="webtoon-content-col-type-2">
<h3>에피소드</h3>
								
<ul class="webtoon-lists">
<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>
</ul>
</li>
<li class="webtoon-content-col-type-2">
<h3>옴니버스</h3>

<ul class="webtoon-lists">
<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>
                                            
<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>
</ul>
</li>

<li class="webtoon-content-col-type-2">
<h3>스토리</h3>
								
<ul class="webtoon-lists">
<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>
</ul>
</li>
</ul>

</div>

</div>


<div class="webtoon-content">
<div class="webtoon-content-header">
<h2>장르별 <span>인기 단행본 만화</span></h2>
</div>

<div class="webtoon-content-body">
						
<ul class="webtoon-content-col-3">
<li class="webtoon-content-col-type-2">
<h3>에피소드</h3>
								
<ul class="webtoon-lists">
<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
										<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>
                                            
<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>
</ul>
</li>
                            
<li class="webtoon-content-col-type-2">
<h3>옴니버스</h3>
								
<ul class="webtoon-lists">
<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>
</ul>
</li>

<li class="webtoon-content-col-type-2">
<h3>스토리</h3>
								
<ul class="webtoon-lists">
<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>

<li class="webtoon-list">
<img src="https://via.placeholder.com/83x90">
<div class="webtoon-content-col-info-right">
<h4>육가족</h4>
<p>pianopia1</p>
<span>육가족의 일상 일기</span>

<div class="webtoon-content-rating">
<div class="star"></div>
<span class="score">9.07</span>
</div>
</div>
</li>
</ul>
</li>
</ul>
</div>

</div>


</div>

#webtoon-main 
	{padding-bottom: 100px;}

#webtoon-main .webtoon-container 
	{overflow: hidden;}

#webtoon-main .webtoon-main-left 
	{float: left;

	width: 694px;
	height: 2000px;}

#webtoon-main .webtoon-main-left .webtoon-carousel 
	{overflow: hidden;
	width: 694px;
	height: 252px;
	background-color: #ffffff;

	margin-bottom: 20px;}

#webtoon-main .webtoon-main-left .webtoon-carousel .webtoon-carousel-left 
	{float: left;
	width: 112px;
	padding: 20px 5px 0 15px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left h2 
	{font-size: 25px
	margin-bottom: 13px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left span 
	{color: #00d564;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left p 
	{font-size: 12px;
	color: #808285;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left ul 
	{margin-top: 48px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left li 
	{font-size: 12px;
	margin-bottom: 10px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left li.on a 
	{color: #00d564;}

#webtoon-main .webtoon-main-left .webtoon-carousel-left li:last-child 
	{margin-bottom: 0;}

#webtoon-main .webtoon-main-left .webtoon-carousel .webtoon-carousel-right 
	{float: right;
	width: calc(100% - 112px);}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner 
	{width: 582px;
	height: 195px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner img 
	{width: 100%;
	height: 100%;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav 	
	{position: relative;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul 
	{display: flex;
	flex-wrap: wrap;
	align-items: center;

	width: 540px;
	margin: 0 auto;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul li 
	{width: 135px;
	height: 57px;
	border-left: solid 1px #e5e5e5;
	border-right: solid 1px #e5e5e5;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul li:fist-child 
	{border-left: none;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul li:last-child 
	{border-right: none;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav ul li img 
	{width: 100%;
	height: 100%;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav .btn 
	{position: absolute;
	width: 20px;
	height: 57px;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav .btn.btn-prev 
	{left: 0;
	top: 0;
	background-color: pink;}

#webtoon-main .webtoon-main-left .webtoon-carousel-banner-nav .btn.btn-next 
	{right: 0;
	top: 0;	
	background-color: blue;}


#webtoon-main .webtoon-main-left .webtoon-banner 
	{width: 100%;
	height: 80px;
	background-color: black;}

#webtoon-main .webtoon-main-left .webtoon-content 	
	{background-color: #ffffff;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header 
	{position: relative;
	border-bottom: solid 1px #e5e5e5;
	padding: 26px 0 10px;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header.webtoon-content-header-recommend 
	{padding-bottom: 0;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header h2 {font-size: 20px;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header h2 span 
	{color: #00d564;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header nav 
	{margin-top: 20px;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header ul 
	{display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header li 
	{width: auto;
	height: 22px;
	margin-right: 15px;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header li.on 
	{border-bottom: solid 2px #00d564;
	margin-bottom: -1px;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-header li a 
	{display: block;
	padding-bottom: 6px;

	font-size: 13px;
	color: #737373;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-body nav 
	{padding: 12px;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-body nav ul 
	{display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-body nav ul li 
	{margin-right: 8px;
	font-size: 12px;}

#webtoon-main .webtoon-main-left .webtoon-content .webtoon-content-body nav ul li a {color: grey;}

#webtoon-main .webtoon-main-left .webtoon-content-col-3
	{display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;} 

#webtoon-main .webtoon-main-left .webtoon-content-col-3 .webtoon-content-col-type-1 
	{width: 210px;
	height: 196px;
	font-size: 12px;} 

#webtoon-main .webtoon-main-left .webtoon-content-col-type-1 img {margin-bottom: 10px;}

#webtoon-main .webtoon-main-left .webtoon-content-col-type-1 .webtoon-content-col-3-info h4 
	{margin-bottom: 5px;}

#webtoon-main .webtoon-main-left .webtoon-content-col-type-1 .webtoon-content-col-3-info p 
	{margin-bottom: 5px;}

#webtoon-main .webtoon-main-left .webtoon-content-col-type-1 .webtoon-content-col-3-info span 
	{color: grey;}


#webtoon-main .webtoon-main-left .webtoon-content-col-type-2 
	{width: 210px;
	font-size: 12px;
	margin-top: 14px;}

#webtoon-main .webtoon-main-left .webtoon-content-col-type-2 h3 
	{font-size: 14px;
	color: grey;
	margin-bottom: 10px;}

#webtoon-main .webtoon-main-left .webtoon-content-col-type-2 .webtoon-lists {	}

#webtoon-main .webtoon-main-left .webtoon-content-col-type-2 .webtoon-lists li 
	{display: flex;
	flex-wrap: wrap;
	align-items: center;
	height: 90px;

	margin-bottom: 20px}

#webtoon-main .webtoon-main-left .webtoon-content-col-type-2 .webtoon-lists li img 
	{margin-right: 10px;}

#webtoon-main .webtoon-main-left .webtoon-content-col-info-right .webtoon-content-rating 
	{margin-top: 15px;}

#webtoon-main .webtoon-main-left .webtoon-content-col-info-right .webtoon-content-rating .star 
	{display: inline-block;

	width: 60px;
	height: 14px;
	background-color: red;

	vertical-align: middle;}

#webtoon-main .webtoon-main-left .webtoon-content-col-info-right .webtoon-content-rating .score 
	{font-size: 12px;
	color: grey;

	vertical-align: middle;}
2)学習内容の難点または未解決の問題
内容が多すぎる
だから中には誤字がたくさんあって、ちょっと追いつけません.
3)ソリューションの作成
もう一度見てから直すだけ...
解決しました.
4)勉強の心得
内容が多くて疲れました.
7月第3週終了後.これは難しい1週間です.
rendering
バックアップなしで失われたデータファイルを再作成(Doc ID 114994.6)